[英]different fillStyle colors for arc in canvas
I imagine the solution to this is very simple, and apologize in advance if this is painfully obvious, but I can't seem to figure out how to set two different fillStyles for two different arcs ...I just wanna be able to draw different color circles.我想解决这个问题的方法很简单,如果这很明显,请提前道歉,但我似乎无法弄清楚如何为两个不同的弧设置两个不同的填充样式......我只是想能够绘制不同的色环。 Below I have how I would normally do it with other shapes/drawing methods in canvas, but for some reason with arcs it sets both arcs to the last fillStyle.
下面我有我通常如何在画布中使用其他形状/绘图方法来完成它,但由于某种原因,它使用弧线将两个弧线都设置为最后一个填充样式。
ctx.fillStyle = "#c82124"; //red
ctx.arc(15,15,15,0,Math.PI*2,true);
ctx.fill();
ctx.fillStyle = "#3370d4"; //blue
ctx.arc(580,15,15,0,Math.PI*2,true);
ctx.fill();
I think you're missing the begin and end path statements.我认为您缺少开始和结束路径语句。 Try the following (it works for me in jsfiddle, see here )
尝试以下操作(它在 jsfiddle 中对我有用,请参见此处)
ctx.fillStyle = "#c82124"; //red
ctx.beginPath();
ctx.arc(15,15,15,0,Math.PI*2,true);
ctx.closePath();
ctx.fill();
ctx.fillStyle = "#3370d4"; //blue
ctx.beginPath();
ctx.arc(580,15,15,0,Math.PI*2,true);
ctx.closePath();
ctx.fill();
Note that the path is just the geometry.请注意,路径只是几何图形。 You can set
.fillStyle
anytime up until the fill( )
.您可以随时设置
.fillStyle
直到fill( )
。
I tried it with the beginPath()
function and it worked.我用
beginPath()
函数尝试过它,它奏效了。 I hope these works for you to:-我希望这些对你有用:-
ctx.fillStyle = "#c82124"; //red
ctx.beginPath();
ctx.arc(15,15,15,0,Math.PI*2,true);
ctx.fill();
ctx.fillStyle = "#3370d4"; //blue
ctx.beginPath();
ctx.arc(580,15,15,0,Math.PI*2,true);
ctx.fill();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.