Fabric JS - 在 PNG 蒙版下制作拼贴画

Question

我们的团队正在制作在线拼贴画。 [https://jsfiddle.net/Lfz1bp7r/3/]

从特征上来说，拼贴画应该在 PNG 文件的掩码之下。在这个阶段，我们正在尝试不同的库。注意fabricJS。拼贴方案是使用 SVG 路径实现的。第一个问题是在 SVG 路径中跟踪鼠标事件。手动实施。主要问题是添加一张新图片，它应该在拼贴上方但在蒙版下方。使用 globalCompositeOperation 进行操作没有帮助。 fabricJS 中没有层。

所以问题是——fabricJS 是否允许您在拼贴顶部但在 PNG 蒙版下添加新图片？有可能吗？

非常感谢您！

Answer 1

FabricJS 包括两种在标准对象和控件图层上方的画布上绘制的方法。您可以设置overlayImage，并且可以使用after:render 事件在画布上下文上运行其他绘制命令。有关如何执行此操作的简单示例，请参阅 Bounding Rectangle demo。

见How Fabric Canvas Layering Works。