Samuele Locatelli
96 lines
3.1 KiB
JavaScript
96 lines
3.1 KiB
JavaScript
window.chartsInterop = {
|
|
charts: {},
|
|
|
|
createChart: function (canvasId, config) {
|
|
// Se esiste già un chart su questo canvas, lo distruggo
|
|
if (this.charts[canvasId]) {
|
|
this.charts[canvasId].destroy();
|
|
}
|
|
|
|
const ctx = document.getElementById(canvasId).getContext('2d');
|
|
this.charts[canvasId] = new Chart(ctx, config);
|
|
},
|
|
|
|
updateChart: function (canvasId, label, value) {
|
|
const chart = this.charts[canvasId];
|
|
if (!chart) return;
|
|
|
|
chart.data.labels.push(label);
|
|
chart.data.datasets[0].data.push(value);
|
|
|
|
if (chart.data.labels.length > 20) {
|
|
chart.data.labels.shift();
|
|
chart.data.datasets[0].data.shift();
|
|
}
|
|
|
|
chart.update();
|
|
},
|
|
|
|
updateBarChart: function (canvasId, label, value) {
|
|
const chart = this.charts[canvasId];
|
|
if (!chart) return;
|
|
|
|
chart.data.labels = [label];
|
|
chart.data.datasets[0].data = [value];
|
|
chart.update();
|
|
},
|
|
|
|
updatePieChart: function (canvasId, updLables, updData) {
|
|
const chart = this.charts[canvasId];
|
|
if (!chart) return;
|
|
|
|
chart.data.labels = updLables;
|
|
chart.data = updData;
|
|
chart.update();
|
|
},
|
|
|
|
|
|
createPieChart: function (canvasId, config) {
|
|
const canvas = document.getElementById(canvasId);
|
|
if (!canvas) return;
|
|
|
|
// Se esiste già un grafico su questo canvas, lo aggiorniamo
|
|
if (this.charts[canvasId]) {
|
|
const chart = this.charts[canvasId];
|
|
|
|
// Aggiorna etichette e dati
|
|
chart.data.labels = config.data.labels;
|
|
chart.data.datasets[0].data = config.data.datasets[0].data;
|
|
chart.data.datasets[0].backgroundColor = config.data.datasets[0].backgroundColor;
|
|
chart.data.datasets[0].borderColor = config.data.datasets[0].borderColor;
|
|
chart.options = config.options;
|
|
|
|
// Update con modalità 'none' per disabilitare l'animazione
|
|
chart.update('none');
|
|
} else {
|
|
// Primo rendering: crea l'istanza e salvala
|
|
const ctx = canvas.getContext('2d');
|
|
this.charts[canvasId] = new Chart(ctx, config);
|
|
}
|
|
},
|
|
|
|
// Opzionale: metodo per distruggere il grafico quando il componente Blazor viene rimosso
|
|
destroyChart: function (canvasId) {
|
|
if (this.charts[canvasId]) {
|
|
this.charts[canvasId].destroy();
|
|
delete this.charts[canvasId];
|
|
}
|
|
},
|
|
|
|
createBarChart: function (canvasId, config) {
|
|
const canvas = document.getElementById(canvasId);
|
|
if (!canvas) return;
|
|
|
|
if (this.charts[canvasId]) {
|
|
const chart = this.charts[canvasId];
|
|
|
|
chart.data.labels = config.data.labels;
|
|
chart.data.datasets = config.data.datasets; // Sostituisce i dataset con i nuovi
|
|
chart.update('none'); // Update senza animazione per aggiornamenti real-time
|
|
} else {
|
|
const ctx = document.getElementById(canvasId).getContext('2d');
|
|
this.charts[canvasId] = new Chart(ctx, config);
|
|
}
|
|
}
|
|
};
|