Come esempio vi riportiamo un semplice grafico creato con un ciclo for();
Vediamo il codice ed analiziamolo insieme.
<!DOCTYPE html>
<html>
<head>
<title>Esempio HTML 5 - Canvas Grafico</title>
<script>
function disegna(){
var canvas = document.getElementById("disegno");
var context = canvas.getContext('2d');
//context.fillStyle = "rgba(0,255,0,30)";
//context.beginPath();
for(i=0;i<400;i+=10)
{
context.moveTo(0,i);
context.lineTo(i+30,500);
context.stroke();
}
}
</script>
<style type="text/css">
canvas { border: 2px solid black; }
</style>
</head>
<body onLoad="disegna()">
<p>Grafico creato con ciclo for()
<canvas id="disegno" width="500" height="500">
Per vedere il disegno vedi Demo in fondo alla pagina
</canvas>
</body>
</html>
