                        课程
                    
                        /前端开发
                        
                            /Html5
                        
                        /炫丽的倒计时效果Canvas绘图与动画基础

为何我绘制的圆有一条一条的连线

<!DOCTYPE html>

<html>

<head>

<title>CanvasArc</title>

</head>

<body>

如果浏览器不支持请更换浏览器！！！

</canvas>

var canvas=document.getElementById("canvas");

canvas.width=800;

canvas.height=800;

var context=canvas.getContext('2d');

for(var i=0;i<10;i++){

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

context.closePath();

context.stroke();

}

</script>

</body>

</html>

请哪位同学帮我运行一下看看问题在哪里谢谢

00:00

喝奶茶的猫

2015-02-06

源自：炫丽的倒计时效果Canvas绘图与动画基础 2-3

关注问题我要回答

1145

操作

收起

2 回答

derrick9006
2015-02-12

beginPath() 呢？

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>CanvasArc</title>
</head>
<body>
<canvas id="canvas" style="display: block;border: 1px solid #aaa;margin: 50px auto">
    如果浏览器不支持请更换浏览器！！！
</canvas>
<script>
        var canvas=document.getElementById("canvas");
        canvas.width=800;
        canvas.height=800;
        var context=canvas.getContext('2d');
        for(var i=0;i<10;i++){
			context.beginPath();
			context.arc(50+i*100,200,40,0,2*Math.PI*(i+1)/10,true);
            context.closePath();
            context.stroke();
        }

</script>
</body>
</html>