canvas - Fabric.js 橡皮擦问题 Canvas

Question

我想使用 Fabric.js 在我的网络应用程序中实现橡皮擦。有没有办法在 Fabric.js 中实现橡皮擦？例如，例如在 MS Paint 中？

Answer 1

Fabric 中没有内置橡皮擦，实现起来有点困难。

Fabric 的事情是一切都是基于对象的，而且大多数事情也是基于向量的。

与原生 Canvas 不同，我们不能只是删除全局位图上的一些像素。我们在下面有整个对象模型， Canvas 输出是所有渲染到 Canvas 上的对象的简单循环。

我们可以模拟橡皮擦的一种方法可能是在 Canvas 上进行某种叠加。并在其上绘制“删除”的线条，给人一种底层物体被消灭的错觉。

但这仍然存在并发症:

我们将如何序列化这一层(到 JSON 或到 SVG)？

如果您删除先前绘制的路径的一半，然后想要使用已删除的形状怎么办？形状本身需要修改；叠加不起作用。

橡皮擦只会影响形状还是也会影响背景颜色？背景图呢？

可能还有更多我目前没有想到的问题。