javascript - 将遮罩画布与 KineticJS 一起使用

Question

在我使用 KineticJS 时，我遇到了一个问题。

我想绘制三种形状：三角形、圆形和特定形状。

所以没有问题，但是我希望叠加层使我的三个形状如下图所示。

• 蓝色圆圈固定在特定的黑色形状中

• 覆盖蓝色圆圈的三角形部分必须具有某种颜色（示例中为灰色），不接触蓝色圆圈的部分必须具有不同颜色（示例中为粉红色）

谢谢你的帮助

Answer 1

我会用剪辑来做到这一点。

1. draw the cloud in black. 
2. clip with cloud.
3. draw circle in blue.
4. draw triangle in pink.
5. clip with circle. 
6. draw  triangle in grey.
7. and  restore context.

小提琴在这里：

http://jsfiddle.net/gamealchemist/T8k7m/