Vorrei lavorare su due canvas distinti, ma nel seguente codice le istruzioni che scrivo nel primo canvas, con id="lavagna1", vengono eseguite stranamente sul secondo canvas, con id="lavagna2". Come fare per indirizzare le istruzioni a ciascuno dei canvas. Grazie

lanvoel

codice:
<!doctype html>
<html>
<body>
<canvas id="lavagna1" width="200" height="200" style="border: 1px solid blue;"></canvas>
<script>
var c1=document.getElementById("lavagna1");
var ctx=c1.getContext("2d"); 
var tempo=0;
var angolo=0;
var l=100;
avvia()
ctx.beginPath();
ctx.strokeStyle="blue";
ctx.arc(l,l,50,0,2*Math.PI);
ctx.stroke();
function avvia()
{
intervallo=window.setInterval("muovi()",100);
}
function muovi()
{
 ctx.clearRect(0,0,lavagna1.width,lavagna1.height);
ctx.beginPath();
ctx.arc(l,l,l,0,2*Math.PI);
ctx.stroke();
tempo=tempo+1;
angolo=tempo*Math.PI/30;
ctx.beginPath();
ctx.strokeStyle="red"
ctx.moveTo(l,l);
ctx.lineTo(l+l*Math.cos(angolo),l+l*Math.sin(angolo));
ctx.stroke();
}
</script>
<canvas id="lavagna2" width="300" height="300" style="border: 1px solid green;"></canvas>
<script>
var c2=document.getElementById("lavagna2");
var ctx=c2.getContext("2d");
ctx.beginPath();
ctx.fillStyle="cyan"
ctx.arc(100,100,50,0,2*Math.PI);
ctx.fill();
ctx.stroke();
</script>
</body>
</html>