在HTML Canvas上绘制自相交多边形

Question

我正在寻找一种方法来绘制带孔的自相交多边形，我正在使用HTML Canvas元素。

所以给了5分，我想画下面的红色。

This question is essentially the same thing.

注：我并不想这样做，用线交叉并加入更多的点，我会用实际的路径将是弯曲的。

Answer 1

我基本肯定你不想自己画这一切，是吗？ http://gpolo.awardspace.info/fill/main.html显示它正在完成，但它是所有手动工作。正在使用的有偶奇和Canvas填充形状与非零缠绕规则填充规则 -

Answer 2

你不能在画布2D单一路径绘制的第一个五角星。

我认为你需要计算内部五边形角落的交点并分开填充它。为了达到您使用的图纸，您可以填充五角星形（没有笔划线），填充内部五边形（再次没有笔划线），然后绘制五边形轮廓笔划而不填充。