当利用canvas进行图形绘制时，对于那么些未关闭的图形，默认会将其关闭，一下实现了如何绘制未关闭图形，以及如何给区域内填充色彩等常用的方法。
以下是腻子，复制粘贴至一格式为HTML的文档即可用：
<canvas id="canvas"style="border:5px solid #ccc;display: block;margin:0 auto;"></canvas>
1 <script type="text/javascript"> 2 window.onload=function(){ 3 var canvas=document.getElementById("canvas"); 4 5 canvas.width = 1024; 6 canvas.height = 800; 7 var context=canvas.getContext("2d"); 8 context.lineWidth=5; 9 context.strokeStyle="#005588"; 10 11 12 for(var i=0;i<10;i++){ 13 context.beginPath(); 14 context.arc(50+i*100,60,40,0,2*Math.PI*(i+1)/10,false); 15 16 context.closePath(); 17 context.stroke(); 18 } 19 for(var i=0;i<10;i++){ 20 context.beginPath(); 21 context.arc(50+i*100,180,40,0,2*Math.PI*(i+1)/10,false); 22 context.stroke(); 23 } 24 for(var i=0;i<10;i++){ 25 context.beginPath(); 26 context.arc(50+i*100,300,40,0,2*Math.PI*(i+1)/10,true); 27 context.closePath(); 28 context.stroke(); 29 } 30 context.fillStyle="#005588"; 31 for(var i=0;i<10;i++){ 32 context.beginPath(); 33 context.arc(50+i*100,420,40,0,2*Math.PI*(i+1)/10,true); 34 context.stroke(); 35 context.fill(); 36 } 37 38 } 39 </script>
