FabricJS：有没有办法使对象在剪辑蒙版之外无法选择？答案

【问题标题】：FabricJS: is there a way to make object unselectable outside of clip mask?FabricJS：有没有办法使对象在剪辑蒙版之外无法选择？
【发布时间】：2022-03-01 18:20:07
【问题描述】：

我正在织物画布上创建网格，用户可以在其中上传网格的每个单元格中的图像。每个单元格都有一个剪贴蒙版，一切都很好。但我的问题是，如果用户在一个单元格中移动图像，您可以在剪贴蒙版之外看到选择。有没有办法将选择保留在剪贴蒙版内？ here is a screen shot

【问题讨论】：

标签： fabricjs

【解决方案1】：

尝试在你的画布选项中添加下一个选项controlsAboveOverlay: true

const canvas = new fabric.Canvas("c", {
  controlsAboveOverlay: true
});

http://fabricjs.com/docs/fabric.Canvas.html#controlsAboveOverlay

编辑： 添加了带有perPixelTargetFind 选项的示例

https://codesandbox.io/s/kind-shtern-hq20u?file=/src/index.js

【讨论】：

看起来controlsAboveOverlay 对我不起作用，真假都试过了。我截取了屏幕截图以更好地代表我的问题i.imgur.com/69OTmsY.jpg
@Entropy 我在上面的回答中为您添加了一个示例。它工作正常。你能解释一下你期望什么行为吗？我会尽力帮助你
我想我现在已经理解你的问题了
这正是我需要实现的，但我需要在每个单元格上都有 clipPath，而不是在画布上。这样当用户在一个单元格中移动或缩放图像时，他仍然可以选择其他单元格。如您所见here，图像选择超出剪辑路径
非常感谢。这为我修好了！