Extending existing chart types to angular js chart using js 2.0 chart

I use excellent chart.js (Version: 2.0.2) and angular-chart.js (Version: 1.0.0-beta1) for compatibility purposes. There are many features that I would like to add to my project (for example, adding a horizontal line to a chart or a rounded corner chart ). All these solutions use

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

I am stuck using it with chart.js v2.0, the doc is not very clear. How to extend an existing chart with chart.js v2.0 ?

Any tips or examples would be appreciated. Thanks!

+3
source share
2 answers

Try this for a 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; 
+1
source

A bit late answer, but you can expand the shape of the element, rather than the type of a specific diagram, from v2.

For instance,

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

There is a question about this in the official Github repository , as well as a great example of its implementation .

+1
source

All Articles