javascript - 如何使用 EaselJS 填充自定义形状/路径

Question

我正在探索 CreateJS。这个问题涉及 EaselJS。

我已经成功绘制了 3 个圆弧并用一种颜色填充它们。

尽管如此，我希望最终结果看起来像这样:

如果我画一个三 Angular 形来填充缺失的空间，我该如何去除底部圆弧内的颜色？

如果我将它设置为透明，它将显示三 Angular 形颜色。
在这种情况下，我可以将它设置为白色以看起来像我想要的那样，但它在彩色背景上看起来会很糟糕。

API 中是否有任何我缺少的方法，以便在使用多条弧线/线绘制的形状内执行类似于洪水填充的操作？

Answer 1

您应该使用 arcTo 来保持路径连续，而不是绘制三个单独的弧。

像这样(当然用你的点/控制点替换数字):

new Graphics().beginStroke(STROKE_COLOR)
    .moveTo(0, 20)
    .arcTo(150, 20, 150, 70, 50)
    .arcTo(150, 20, 150, 70, 50)
    .arcTo(150, 20, 150, 70, 50)
    .endStroke();