4
votes

I'm using the great chart.js (Version: 2.0.2) and angular-chart.js (Version: 1.0.0-beta1) for compatibility purposes. There are a lot of functionalities I would like to add to my project (like adding a horizontal line to a chart or having a rounded corners bar chart). All theses solutions use

Chart.types.[typeOftheChartToExtend].extend({..}).

I'm stuck using it with chart.js v2.0, the doc isn't very clear. How can I extend existing chart using chart.js v2.0 ?

Any advice or example would be appreciated. Thanks!

2
were you able to solve this issue? I too have same problem. Any help is much appreciated.atik

2 Answers

3
votes

A bit late answer but you can extend the shape of the element, not the type of the specific chart, from v2.

For example,

Chart.elements.Rectangle.prototype.draw = function() {
   // Do your draw thingy.
}

There's an issue regarding this one at the official Github repo and also a great example of implementing it.

1
votes

Try this for the line chart:

var originalLineController = Chart.controllers.line;
Chart.controllers.line = Chart.controllers.line.extend({
    draw: function() { 
        originalLineController.prototype.draw.apply(this, arguments);
        /* own drawing code here */
    }
}

You can get the context with:

var ctx = this.chart.chart.ctx;