Is it possible to draw a constant line across a line chart?
Hello, this issue looks like a QUESTION regarding the Chart.js API. It would be very helpful if you could please create an example chart showing your attempt, and even call the methods that don't exist yet which you are expecting to be there. A mockup here of what the result should look like would be for bonus points.
To help, I have created a simple JSBIN which you could fork:
http://jsbin.com/yozobahucero/1/edit?html,js,output
Sorry that this response is templated as we are triaging many issues and ones with test cases will be seen first.
I'm trying to extend the Line chart in Chart.js with this code:
var shotsData = {
labels: ["Shot 1", "Shot 2", "Shot 3", "Shot 4", "Shot 5"],
datasets: [{ data: [5, 7, 1, 4, 9] }]
};
var ctx = document.getElementById("shots").getContext("2d");
Chart.types.Line.extend({
name: "LineAlt",
initialize: function () {
this.chart.ctx.beginPath();
this.chart.ctx.moveTo(0, 15);
this.chart.ctx.lineTo(159, 274);
this.chart.ctx.stroke();
Chart.types.Line.prototype.initialize.apply(this, arguments);
}
});
new Chart(ctx).LineAlt(shotsData);
This draws my chart, but I also want a custom line within the chart, which is written inside the initialize function, but this seems to not work. When I remove the line Chart.types.Line.prototype.initialize.apply(this, arguments); the custom line is displayed.
Here's a fiddle
Here is a sample of what could be done :
https://github.com/Dergonic/Chart.js/commit/e0210069609d1cda259f5b699a6b29cd1ed12706
(Quick fix, not fully tested)
I started a plugin to track this https://github.com/chartjs/Chart.Annotation.js
It can already do horizontal and vertical lines
Closing since this will not be implemented in the core. The annotation plugin listed above is the best way to do this.
Most helpful comment
I started a plugin to track this https://github.com/chartjs/Chart.Annotation.js
It can already do horizontal and vertical lines