After a ChartJS migration from v2 to v3 i'm unable to registed a global plugin, by following the migration guide i changed Chart.plugins.register in Chart.register but i get this:
class does not have id: function (chart)
The issue i think is in afterDraw function but how should it be fixed after a migration?
The code
Chart.register({
afterDraw: function (chart) {
var data = chart.data.datasets[0].data;
if (data.length === 0) {
// No data is present
var ctx = chart.chart.ctx;
var width = chart.chart.width;
var height = chart.chart.height
chart.clear();
ctx.save();
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
ctx.font = "16px normal 'Helvetica Nueue'";
ctx.fillText('Nessun dato disponibile', width / 2, height / 2);
ctx.fontColor = "#828282";
ctx.restore();
}
}
});
By reading the documentation better a unique id must be configured for each registered plugin.
Plugins must define a unique id in order to be configurable.
So i just added the id in my code
Chart.register({
id: 'no_data_label',
afterDraw: (chart, args, options) => {
const data = chart.data.datasets[0].data;
if (data.length === 0) {
// No data is present
console.log(chart)
const current = chart.ctx;
const width = chart.width;
const height = chart.height
chart.clear();
current.save();
current.textAlign = 'center';
current.textBaseline = 'middle';
current.font = "16px normal 'Helvetica Nueue'";
current.fillText('Nessun dato disponibile', width / 2, height / 2);
current.fontColor = "#828282";
current.restore();
}
}
});