Chart.js - увеличить расстояние между нижней легендой и графиком

Question

Я пытаюсь достичь чего-то вроде этого , но с легендой внизу. Когда я пытаюсь добавить его максимум, я могу получить что-то вроде этого:

Я рассматриваю возможность разделения легенды на другой div, как

<div id="js-legend" class="chart-legend"></div>

но было бы неплохо добиться этого с помощью прежнего решения.

Заранее спасибо за помощь

Answer 1

Я думаю, что-то вроде этого должно работать.

plugins: [{
          beforeInit: (chart, options) => {
            chart.legend.afterFit = () => {
              if (chart.legend.margins) {
                // Put some padding around the legend/labels
                chart.legend.options.labels.padding = 20;
                // Because you added 20px of padding around the whole legend,
                // you will need to increase the height of the chart to fit it
                chart.height += 40;
              }
            };
          }
        }]

Answer 2

вы можете использовать margin-top для # js-legend.