Chartjs-Chart.js 2.1.6: Drawing horizontal Limit Lines?

3๐Ÿ‘

โœ…

Add the Chart.Annotation.js to your project and do:

annotation: {
    annotations: [{
        type: 'line',
        mode: 'horizontal',
        scaleID: 'y-axis-0',
        value: '25',
        borderColor: 'red',
        borderWidth: 2
    }]
}

in the options

0๐Ÿ‘

You can draw horizontal and vertical line in chart.js ,
Try this , ywhich is using Chart.js Version: 2.2.1

http://plnkr.co/edit/8HJtZ7WKmTEy2gGuOT0v?p=preview

thanks to this fiddle ,I Updated it with latest version of chart.js and do changes on that.

0๐Ÿ‘

For anyone interested in drawing multiple limit lines (e.g. one limit for each data point), I found an easy approach was to simply create a mixed chart, with a line-series representing your limit points. Once you have this, you can use the following options to turn the line points into flat lines, and hide the overall line:

pointStyle: 'line',
radius: 20,
fill: false,
showLine: false,

Leave a comment