创建后修改画布颜色
我使用画布在页面上创建三角形集合,然后用大渐变将它们全部覆盖。
创建这些三角形后,是否有一种方法可以引用它们,以便在某个事件上使用 javascript 更改它们的颜色?还是我必须重新画三角形?
生成三角形的 for 循环:
context.fillStyle = color[i-1];
context.beginPath();
context.moveTo(1,leftStart+(itemStartHeight*(i-1))); //Tl
context.lineTo(width,(itemHeight*(i-1))); //Tr
context.lineTo(width,(itemHeight*i)+1); //Br
context.lineTo(1,leftStart+(itemStartHeight*i)+(i!=items ? 1 : 0)); //Bl
context.closePath();
context.fill();
Using canvas I am creating a collection of triangles on a page and then overlaying them all with a large gradient.
Once these triangles are created is there a way to reference them to change their color with javascript on a certain event? Or do I have to draw the triangle again?
The for loop that makes the triangles:
context.fillStyle = color[i-1];
context.beginPath();
context.moveTo(1,leftStart+(itemStartHeight*(i-1))); //Tl
context.lineTo(width,(itemHeight*(i-1))); //Tr
context.lineTo(width,(itemHeight*i)+1); //Br
context.lineTo(1,leftStart+(itemStartHeight*i)+(i!=items ? 1 : 0)); //Bl
context.closePath();
context.fill();
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
默认情况下,无法引用在
canvas
元素上绘制的各个内容,要更改颜色,您必须重新绘制它们Theres no way to reference individual things drawn on the
canvas
element by default, to change the colors you have to redraw them