Apply/Register conflicting plugins to different charts
I think a solution is to assign a specific property in your chart options for each plugin. Each chart will fill a different attribute to use each plugin. In your case, you have plugin1
and plugin2
.
Then, in each definition you will check for different attributes to see if that chart is using that plugin or not. For example, your definitions will be something like:
Chart.pluginService.register({
afterDraw: function(chart) {
if (chart.config.options.plugin_one_attribute) {
// Plugin code here...
}
}
});
To use this plugin, your chart will have to fill the plugin_one_attribute, in its options. Like this:
optionsUsingPlugin1 = {
plugin_one_attribute: // Your variable to be used in the plugin goes here!
responsive: true,
maintainAspectRatio: true,
title: {
display: true
}
// And any other config options you are already using
}
And use this when creating your chart:
var myBar = new Chart(ctx, {
type: 'bar',
data: data,
options: optionsUsingPlugin1
});
So, in order to use plugin2, your myBar2 chart will need a specific attribute for plugin2 (which will check for it when registering). This way you can control which plugins will be active in each chart.
Hope that helps!