在javascript画布上剪切椭圆内的线

我正在javascript画布上绘制一个填充椭圆（使用arc（））：

ctx.arc(centerX, centerY, dotDiameter / 2, 0, 2 * Math.PI, false);
ctx.fillStyle = color1;
ctx.fill();

然后我想画一条线，剪到这个椭圆上，用不同的颜色

ctx.clip(); // Clip to the ellipse
ctx.strokeStyle = color2;
ctx.moveTo(centerX - dotRadius, centerY);
ctx.lineTo(centerX + dotRadius, centerY);
ctx.stroke();

但是，椭圆也使用颜色2进行笔划

如何将线剪裁到椭圆上，但不对椭圆进行笔划？调用clip（）后，有没有办法从画布上删除椭圆（也称为圆弧）

谢谢

---

（仅供参考，这是对我的代码的过度简化。笔划的线条比单个水平线条更复杂，线条确实需要剪裁。）

我们可以用一些基本的三角法计算省略号周长上的一点

  ctx.moveTo(x, y);
  x += radiusX * Math.cos(lineangle)
  y += radiusY * Math.sin(lineangle)
  ctx.lineTo(x, y);

请参阅下面的代码片段，我正在从中心到边缘绘制一个椭圆和一条线

ctx=document.getElementById（'c'）.getContext（'2d'）；
ctx.lineWidth=2；
函数绘图（x、y、半径x、半径y、线性角、颜色1、颜色2）{
ctx.beginPath（）
椭圆（x，y，radiusX，radiusY，0，0，2*Math.PI，false）；
ctx.fillStyle=color1；
ctx.fill（）；
ctx.beginPath（）
ctx.strokeStyle=color2；
ctx.moveTo（x，y）；
x+=半径x*数学系数（线性角）
y+=半径y*Math.sin（线性角）
ctx.lineTo（x，y）；
ctx.stroke（）；
}
角度=0
函数循环（）{
ctx.clearRect（0,0500500）；
绘制（80，80，70，50，角度，“红色”，“石灰”）
绘制（240、60、80、30，角度*0.7，“黑色”、“青色”）
绘制（360、80、30、70，角度*2，“白色”、“黑色”）
角度+=0.05
}
设置间隔（循环，100）

---

a

ctx.arc（

不会绘制ellipse@HelderSepulveda：请参见关于使用圆弧（）绘制圆（和圆的一部分）.嗨，史蒂夫，是的，但你说的是椭圆…圆弧不会做椭圆，但我做的不仅仅是直线，所以我更喜欢用笔划在椭圆区域内剪裁，而不是椭圆区域笔划。@SteveA这段代码只是一个基础，向你展示后面的数学…你可以画椭圆或不画椭圆，这取决于你自己