closePath()并不是结束路径,而是闭合路径

来源:2-2 绘制直线、多边形和七巧板

慕仔1561325

2019-01-27 13:33

closePath()是自动画一条直线与起点相连闭合路径,并不是与beginPath()一起使用来开启新路径和关闭路径,两者一毛钱关系都没有,beginPath()本身就有结束之前路径的作用

如下两段代码:


window.onload = function() {

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

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

    context.moveTo(50,50);

context.lineTo(500,400);

context.lineTo(500,50);

context.strokeStyle='red';

context.closePath();

context.stroke();


context.beginPath();

context.moveTo(50,50);

context.lineTo(500,225);

context.strokeStyle='green';

context.stroke();

}


开始只画了两条线段,closePath()自动闭合路径成一个三角形,后面把颜色改为绿色但是只影响最后画的一条线段并没有全部变绿,说明beginPath()已经结束了之前的路径

写回答 关注

1回答

  • 风语1201
    2019-04-15 15:40:30

    分析的没错,context.closePath()只是闭合之前的路径,context.beginPath()才是重新开始新的路径

炫丽的倒计时效果Canvas绘图与动画基础

学习HTML5中最激动人心的技术Canvas,彻底释放自己的创造力

96746 学习 · 1000 问题

查看课程

相似问题