HTML5 canvas in tempo reale

Grafico a torta - live

Se riesci a leggere questo, il tuo browser non supporta Canvas.
var NomiArray = ["Nome0","Nome1","Nome2","Nome3","Nome4"]; // etichette
var ValoriArray = [,,,, ];
var ColoriArray = ["#FF0000","#00FF00","#0000FF","#00FFFF","#FF00FF"];
var LastEnd = 0; var TotaleValori = 0;
var CentroX = ; var CentroY = ; var Raggio = ;
ctx.font = "12px Arial"
for (var i = 0; i !=5 ; i++) {TotaleValori = TotaleValori + ValoriArray[i];};
for (var i = 0; i != 5; i++) {
ctx.fillStyle = ColoriArray[i];
ctx.beginPath();
ctx.moveTo(CentroX,CentroY);
ctx.arc(CentroX,CentroY,Raggio,LastEnd,LastEnd+
(Math.PI*2*(ValoriArray[i]/TotaleValori)),false);
ctx.lineTo(CentroX,CentroY);
ctx.fill();
LastEnd += Math.PI*2*(ValoriArray[i]/TotaleValori);
}
ctx.fillStyle = "#000000";
ctx.fillText("Totale valori = " + TotaleValori ,CentroX - Raggio, CentroY - (Raggio+10) ); // totale
for (var i = 0; i != 5; i++) { ctx.fillStyle = ColoriArray[i]; // colori voci legenda
ctx.fillText(NomiArray[i]+" = "+ValoriArray[i],CentroX + Raggio + 20, 30 + i * 25); // legenda
}

Acquistabile da:
• bookrepublic
• ebook LeggoOggi.it
• EURONICS
• freeonline
• Gola Ad
• GPLAY
• HOEPLI
• iTunes
• kobo
• omnia BUK
• SECRETARY
• StreetLib

Questo e-book è un e-book interattivo, ciò significa che il lettore può inserire dei dati nelle pagine ed il contenuto di queste si adeguerà ai nuovi valori. Per inserire i dati, nelle pagine dell’e-book, sono stati implementati dei controlli simili a quelli che si possono trovare sulle pagine Internet ed un pulsante esegui per impartire il comando di adeguare il contenuto della pagina ai nuovi valori.