Creating plugins

Plugins are the most efficient way to extend Chart.js. A plugin can insert code before and after different phases of the rendering cycle of a chart. At each phase, it can access the chart object and read configurable options. This can be used to change practically any property or behavior of the chart.

Plugins are designed to be reusable. During the previous chapters, we used several popular plugins to extend Chart.js in different ways. They are great to encapsulate complexity, but simple plugins can also be very useful.

In the last example, we created a download link for a PNG version of the chart. If you tried it, you may have noticed that the image has a transparent background. This is OK if your background is white, but if it isn’t, the chart may be hard to read. A naïve approach to fixing the problem would be painting the canvas white using CSS or fill commands. But, it won’t work because Chart.js redraws the canvas during its render cycle. You also need to deal with...