Chart.js: Is there a non-animation callback for when the chart completes?

[arxpoetica]

I recognize that I can hook into various callbacks via a chart.js plugin, i.e., all the following callbacks are made available to a plugin: resize, beforeInit, beforeUpdate, afterScaleUpdate, beforeDatasetsUpdate, afterDatasetsUpdate, afterUpdate, beforeRender, afterInit, beforeDraw, beforeDatasetsDraw, afterDatasetsDraw, afterDraw, destroy...

...but...

What if one wants to hook into (for example) afterInit without going to the trouble of creating a plugin. In other words, it seems like many (or all?) of these callbacks ought to be available on any given chart instance.

Right now the only technique I know for checking if the chart has initialized is to hook into the animation progress callback and check for the first loop on the animation, which is complete hackery. So I built a plugin to hook in.

Is there a way to do this without a plugin?

If not can it be a feature request?

[etimberg]

The recommended way to do this is to use a plugin. We can add something else if it is heavily requested

[arxpoetica]

Here's another problem with doing it in a plugin. Let's say I have set up multiple instances of a chart, each one doing different things. Sure, I can create a plugin to hook into the afterInit callback. But that callback will do the same thing for each instance. What if I want a different behavior for different charts on afterInit? Do I create a separate plugin for each behavior? It would be easier to have afterInit available as an option, and set different callbacks on each instance. Imagine now that you have hundreds of chart instances...

I currently have this problem, and I've had to do some pretty hacky things to get different callback behaviors without creating multiple plugins...

[simonbrunel]

I agree and I was thinking we could implement inline plugins, which might be a solution to your case:

new Chart(ctx, {
    options: {
        plugins: [{
            afterInit: function() {
            }
        }]
    }
});

It could also be refactored and used for multiple charts:

var pluginA = { afterInit: function() { } };
var pluginB = { afterRender: function() {} };

new Chart(ctx, {
    options: {
        plugins: [pluginA, pluginB]
    }
});

new Chart(ctx, {
    options: {
        plugins: [pluginA]
    }
});

To enable plugins for all charts:

Chart.defaults.global.plugins.push(pluginA, pluginB);

[arxpoetica]

...I suppose that could work...?

[simonbrunel]

@etimberg @zachpanz88 what do you guys think about inline plugins?

[etimberg]

I like the idea. Should be relatively easy to implement too since we have a method already for dispatching a generic plugin call

[etimberg]

Update on this: started with inline plugins in #3363 but we need to do some thinking on the exact API