Chartjs-Chart js footer

by

1👍

✅

Ok, I figured it out. Basically, I’m adding padding in BeforeInit and then add description in BeforeDraw (only the essence here):

beforeInit: function (chart, options) {
    let isPieOrDoughnut = chart.config.type === 'pie' || chart.config.type === 'doughnut';
    if (isPieOrDoughnut) {
        chart.options.scales.xAxes[0].gridLines.lineWidth = 0;
        chart.options.scales.xAxes[0].display = true;
    }

    chart.options.scales.xAxes[0].scaleLabel.padding.bottom = 50;
},
beforeDraw: function (chart, options) {
    ctx = chart.chart.ctx;
    ctx.restore();
    ctx.font = "1em sans-serif";
    let height = chart.chart.height;
    ctx.fillText('description', 30, height - 35);
    ctx.save();
}

Leave a comment