在画布上放下更多图片

Question

我是Fabric.js的新手，我正在寻找在drop事件后在画布上绘制图片的方法。

我已经得到了它，但我不知道如何在画布上插入更多图片（在第二滴上我只有最后一张插图画布）。

我应该插入＆lt; img＆gt;将对象放入某个数组然后绘制数组？ 或存在其他解决方案？

我的问题示例： http://fiddle.jshell.net/654321mia/8JSVK/10/

每次只能在画布上只有一张图片。

Answer 1

我已更新您的jsfiddle，现在可以正常使用。

问题是您在第一次删除后创建了fabric.js Canvas。这导致重新创建canvas元素，并且您在HTML中设置的事件处理程序将丢失。当然有一个更好的方法来使用fabric.js，但我只是将drop处理程序放在画布的容器上，这样它就可以完美地运行：

<div id="myCanvas-container" style="border:1px solid #d3d3d3;" ondrop="drop(event)" ondragover="allowDrop(event)">
    <canvas id="myCanvas">
        Your browser does not support the HTML5 canvas tag.
    </canvas>
</div>