我想使用Fabric.js在我的Web应用程序中实现橡皮擦。有什么方法可以在Fabric.js中实现橡皮擦吗?例如在MS Paint中?

最佳答案

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

关于Fabric的事情是,所有事物都是基于对象的,而大多数事物也是基于矢量的。

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

我们可以模拟橡皮擦的一种方法可能是在画布上进行某种覆盖。并在其上绘制“已擦除”的线条,给人以擦除潜在对象的错觉。

但是,这仍然存在一些并发症:


我们如何将这一层序列化(转换为JSON或SVG)?
如果您删除了先前绘制的路径的一半,然后又想使用已经删除的形状怎么办?形状本身需要修改;覆盖不起作用。
橡皮擦只会影响形状还是会影响背景颜色?那背景图片呢?


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

08-07 08:22