如何在fabricjs中做'基于pixie'的免费绘图

时间:2014-01-25 18:52:24

标签: html5 canvas fabricjs

我正在尝试为基于fabricjs的0.5 Opacity免费绘图应用程序(具有非平凡的背景图像)制作'橡皮擦',i。即所有绘图都是半透明的,我们仍然可以通过自由绘图看到背景。

但是我默认情况下所有免费绘图都是“基于路径的”i。即我们绘制的所有内容(在鼠标按下鼠标之间)都被捕获为画布中的单个路径,因此无法擦除路径的任意部分。所以我想也许我们可以手动捕捉鼠标按下/向上事件并用小精灵画出一个小精灵图像并将其放在画布上,不透明度= 0.5?这样我们就可以用白色来覆盖所有那些'旧'的绘画?

这是一个可行/有效的解决方案吗?

但我不确定如何在fabricjs中实施此功能?你能不能给我一些关于步骤或伪代码的建议?谢谢

1 个答案:

答案 0 :(得分:0)

当我遇到类似问题时,我没有完成我的尝试,但基本概念很简单'读取光标下的像素(并在画布下,另一个带有背景图像的画布)并绘制路径相同的颜色',创造橡皮擦效果。最初的石头是这个jsfiddle.net/DV9Bw/1/也许它可以帮助你,我没有尝试它完成,因为这个想法很快就被放弃了