怎样用canvas来绘制弧线和圆

window.onload= function () {        var canvas=document.getElementById("canvas");        if(canvas.getContext("2d")){            var context=canvas.getContext("2d");

            context.lineWidth=5;

            context.strokeStyle="red";         

            for(var i=0;i<10;i++){//绘制十个弧线，收尾封闭，没有填充色

                context.beginPath();

                context.arc(50+i*100,60,40,0,2*Math.PI*(i+1)/10);

                context.closePath();//使弧线封闭，形成一个闭合图形

                context.stroke();

            }            for(var i=0;i<10;i++){//绘制十个弧线，收尾不封闭，没有填充色

                context.beginPath();

                context.arc(50+i*100,180,40,0,2*Math.PI*(i+1)/10);

                context.stroke();

            }            for(var i=0;i<10;i++){//绘制十个弧线，收尾封闭且填充为默认色

                context.beginPath();

                context.arc(50+i*100,300,40,0,2*Math.PI*(i+1)/10,true);//逆时针绘制

                context.fill();

            }

        }else {

            alert("不支持canvas,请更换浏览器！")

        }

    };