javascript - 使用图层和blendMode制成的Paper.js橡皮擦工具

我正在使用Paper.js和Node.js制作简单的绘图应用程序。有2层：
-底层有图像
-绘图的顶层。
具有图像的图层是绘图层的背景。

我想制作一个简单的橡皮擦工具，该工具可以擦除路径上的图形。我正在尝试在顶层将blendMode设置为“ destination-out”的第二条路径中添加路径。

drawingLayer.activate();
path = new Path();
path.strokeColor = 'black';
path.strokeWidth = 5;

if (mode == "erase") {
  path.strokeWidth = 15;
  path.blendMode = 'destination-out';
}

我的问题是，这种“目标输出”路径不仅会擦除顶层（绘图层）上的所有内容，还会擦除底层（图像）上的所有内容。当然，我希望图像保持橡皮擦不变。当我在CSS中为页面设置一些背景时，它不会被橡皮擦路径擦除。

您知道一种使橡皮擦修改顶层而不修改底层的方法吗？

最佳答案

解决方案是在使用橡皮擦工具之前激活要擦除的图层，如下所示：

var firstLayer = paper.project.activeLayer; //This one is used to erase
var shapesLayer = new Layer(); // We don't want to erase on this one

所以基本上，当选择橡皮擦工具时，我会

firstLayer.activate();

然后，当我想绘制形状时，只需以相同的方式激活“ shapesLayer”即可。这样可以避免新路径（用于擦除的路径）接触“ shapesLayer”中的任何内容

关于javascript - 使用图层和blendMode制成的Paper.js橡皮擦工具，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24536081/