Chartjs-Chart.js / HTML Canvas – move line

by

0👍

✅

I solve it with plugin.

var verticalLinePlugin = {
afterDraw: function(chartInstance) 
{       
    var index = weatherMainChart.config.options.verticalLine[0].x;

    if (index) 
    {
            if (chartInstance.options.verticalLine) 
            {
                var canvas = chartInstance.chart;
                var ctx = canvas.ctx;
                var xaxis = chartInstance.scales['x-axis-0'];
                var yaxis = chartInstance.scales['A'];

                ctx.save();
                ctx.beginPath();
                ctx.moveTo(xaxis.getPixelForValue(undefined, index), yaxis.top + 32);
                ctx.strokeStyle = '#005580';
                ctx.lineTo(xaxis.getPixelForValue(undefined, index), yaxis.bottom);
                ctx.stroke();
                ctx.restore();
            };
    }
}
};

Chart.pluginService.register(verticalLinePlugin);

Leave a comment