Widget:Grafico: differenze tra le versioni
Da WikiLectio.
m test |
m test |
||
| Riga 18: | Riga 18: | ||
if (!c) { if (msg) msg.textContent = "Canvas non trovato (id="+id+")"; return; } | if (!c) { if (msg) msg.textContent = "Canvas non trovato (id="+id+")"; return; } | ||
var ctx = c.getContext('2d'); | |||
// 0) Traccia DIAGONALE raw canvas (debug): se la vedi, il canvas è ok | |||
ctx.strokeStyle = '#bbb'; | |||
ctx.lineWidth = 1; | |||
ctx.beginPath(); ctx.moveTo(0,0); ctx.lineTo(c.width, c.height); ctx.stroke(); | |||
// 1) Verifica Chart.js locale | |||
if (typeof Chart === "undefined") { | |||
if (msg) msg.textContent = "Chart.js locale non caricato: controlla /resources/chart.umd.js"; | |||
return; | |||
} | |||
// 2) REGISTRA esplicitamente i componenti (fix per build che non autoincludono) | |||
try { | |||
if (Chart && Chart.register && Chart.registerables) { | |||
Chart.register(...Chart.registerables); | |||
} | |||
} catch (e) { | |||
console.warn("[Widget:Grafico] impossibile registrare i registrables:", e); | |||
} | |||
// 3) Costruisci il grafico DEMO | |||
try { | try { | ||
var labels = [0, 2, 4, 6, 8, 10]; | var labels = [0, 2, 4, 6, 8, 10]; | ||
| Riga 25: | Riga 46: | ||
var data2 = [0, 2, 4, 6, 8, 10]; // Offerta | var data2 = [0, 2, 4, 6, 8, 10]; // Offerta | ||
// pulisci la diagonale di debug prima di disegnare il grafico | |||
ctx.clearRect(0, 0, c.width, c.height); | |||
new Chart(ctx, { | |||
type: 'line', | type: 'line', | ||
data: { | data: { | ||
| Riga 33: | Riga 57: | ||
label:'Domanda', | label:'Domanda', | ||
data: data1, | data: data1, | ||
borderColor: '#d62728', | borderColor: '#d62728', | ||
backgroundColor: '#d62728', | backgroundColor: '#d62728', | ||
borderWidth: 2, | borderWidth: 2, | ||
pointRadius: 3, | pointRadius: 3, | ||
tension: 0 | tension: 0 | ||
}, | }, | ||
| Riga 43: | Riga 66: | ||
label:'Offerta', | label:'Offerta', | ||
data: data2, | data: data2, | ||
borderColor: '#1f77b4', | borderColor: '#1f77b4', | ||
backgroundColor: '#1f77b4', | backgroundColor: '#1f77b4', | ||
borderWidth: 2, | borderWidth: 2, | ||
pointRadius: 3, | pointRadius: 3, | ||
tension: 0 | tension: 0 | ||
} | } | ||
| Riga 60: | Riga 82: | ||
}, | }, | ||
scales: { | scales: { | ||
x: { | x: { type: 'category', title: { display: true, text: 'Quantità' }, grid: { display: true } }, | ||
y: { title: { display: true, text: 'Prezzo' }, min: 0, max: 12, grid: { display: true } } | |||
y: { | |||
} | } | ||
} | } | ||
| Riga 81: | Riga 94: | ||
})(); | })(); | ||
</script> | </script> | ||
</includeonly> | </includeonly> | ||
