Fabric.js橡皮布問題畫布

Question

我想使用Fabric.js在我的Web應用程序中實施橡皮擦。有沒有辦法在Fabric.js中實現橡皮擦？例如，如在MS Paint中？

Answer 1

Fabric中沒有內置橡皮擦，實現起來有點困難。

有關面料的事情是，一切都是基於對象的，大部分事物也是基於矢量的。

與本地畫布不同，我們不能只擦除全局位圖上的一些像素。我們在底下有整個對象模型，而畫布輸出是所有那些渲染到畫布上的對象的簡單循環。

我們可以模擬橡皮擦的一種方法可能是在畫布上放置某種疊加層。並在其上畫「擦除」的線條，給底層對象造成錯覺。

但仍有併發症這樣的：

• 我們如何序列化此層（到JSON或SVG）？
• 如果您擦除了之前繪製的路徑的一半，然後想要使用已經擦除的形狀，該怎麼辦？形狀本身需要修改;疊加不起作用。
• 橡皮擦會影響只有形狀或背景顏色？背景圖片怎麼樣？

有可能更多的問題，我目前沒有想到。