Widget:Grafico: differenze tra le versioni
Da WikiLectio.
m test |
m test |
||
| Riga 38: | Riga 38: | ||
</div> | </div> | ||
<!-- Chart.js | <!-- Chart.js locale --> | ||
<script src=" | <script src="/resources/chart.umd.js"></script> | ||
<script> | <script> | ||
| Riga 49: | Riga 48: | ||
function numOrUndef(s){ const n = Number(s); return isNaN(n) ? undefined : n; } | function numOrUndef(s){ const n = Number(s); return isNaN(n) ? undefined : n; } | ||
var id = | var id = "<!--{$id|escape:'html'}-->"; | ||
var c = document.getElementById("canvas_" + id); | var c = document.getElementById("canvas_" + id); | ||
var msg = document.getElementById("chartmsg_" + id); | var msg = document.getElementById("chartmsg_" + id); | ||
if(!c){ if(msg) msg.textContent = "Canvas non trovato (id="+id+")"; return; } | if(!c){ if(msg) msg.textContent = "Canvas non trovato (id="+id+")"; return; } | ||
if(typeof Chart === "undefined"){ if(msg) msg.textContent = "Chart.js non caricato | if(typeof Chart === "undefined"){ if(msg) msg.textContent = "Chart.js (locale) non caricato: controlla /resources/chart.umd.js"; return; } | ||
try { | try { | ||
| Riga 60: | Riga 59: | ||
var labels = csvToArray(ds.labels); | var labels = csvToArray(ds.labels); | ||
// Leggi i data-attributes (camelCase) | |||
var seriesDefs = [ | var seriesDefs = [ | ||
{ t: ds.series1Title, d: ds.series1Data, ty: ds.series1Type, c: ds.series1Color }, | { t: ds.series1Title, d: ds.series1Data, ty: ds.series1Type, c: ds.series1Color }, | ||
| Riga 83: | Riga 83: | ||
}); | }); | ||
// Punto di equilibrio opzionale | |||
var eqx = Number(ds.eqx), eqy = Number(ds.eqy); | var eqx = Number(ds.eqx), eqy = Number(ds.eqy); | ||
if(!isNaN(eqx) && !isNaN(eqy)){ | if(!isNaN(eqx) && !isNaN(eqy)){ | ||
| Riga 102: | Riga 103: | ||
data: { labels: labels, datasets: datasets }, | data: { labels: labels, datasets: datasets }, | ||
options: { | options: { | ||
responsive: (ds.responsive | responsive: truthy(ds.responsive), | ||
maintainAspectRatio: false, | maintainAspectRatio: false, | ||
plugins: { | plugins: { | ||
title: { display: !!ds.title, text: ds.title }, | title: { display: !!ds.title, text: ds.title }, | ||
legend: { display: (ds.showLegend | legend: { display: truthy(ds.showLegend) }, | ||
tooltip: { enabled: true } | tooltip: { enabled: true } | ||
}, | }, | ||
| Riga 114: | Riga 115: | ||
type: 'linear', | type: 'linear', | ||
title: { display: true, text: ds.xTitle || 'Quantità di appartamenti' }, | title: { display: true, text: ds.xTitle || 'Quantità di appartamenti' }, | ||
min: | min: numOrUndef(ds.xmin), max: numOrUndef(ds.xmax) | ||
} : { | } : { | ||
type: 'category', | type: 'category', | ||
| Riga 122: | Riga 122: | ||
y: { | y: { | ||
title: { display: true, text: ds.yTitle || "Prezzo dell'affitto" }, | title: { display: true, text: ds.yTitle || "Prezzo dell'affitto" }, | ||
min: | min: numOrUndef(ds.ymin), max: numOrUndef(ds.ymax), | ||
beginAtZero: false | beginAtZero: false | ||
} | } | ||
| Riga 137: | Riga 136: | ||
})(); | })(); | ||
</script> | </script> | ||
</includeonly> | </includeonly> | ||
