Javascript fabric.js-从canvas API的ImageData对象创建图像对象

我想从

ImageData

对象在fabric.js中创建一个图像对象，我们可以从以下内容获取图像数据：

var imgData=ctx.getImageData(10,10,50,50);
//ctx.putImageData(imgData,10,70);

// something liket that
var image = new fabric.Image.fromImageData (...);

---

有什么方法可以从

ImageData

对象创建图像对象吗？

让我把我的想法放在这里，我不喜欢这种方法，但周围没有其他方法-

var ctx = canvas.getContext('2d');
var data = ctx.getImageData(0, 0, 20, 20);

var c = document.createElement('canvas');

c.setAttribute('id', '_temp_canvas');
c.width = 20;
c.height = 20;

c.getContext('2d').putImageData(data, 0, 0);

fabric.Image.fromURL(c.toDataURL(), function(img) {
    img.left = 50;
    img.top = 50;
    canvas.add(img);
    img.bringToFront();
    c = null;
    $('#_temp_canvas').remove();
    canvas.renderAll();
});

---

我只想裁剪一幅图像，并从fabric.js中的数据创建一个新的图像对象。我有办法创建另一个画布，但它并不优雅，我认为直接进行比较好。我只是在

toDataURL

中推送了裁剪支持（有一段时间一直打算这么做）-所以现在可以在fabric画布上绘制图像，然后通过

canvas.toDataURL（{left:…，top:…，width:…，height:…}）裁剪它。

获取数据url。当然，该数据url可用于创建新图像，这解决了裁剪问题，但不适用于像素处理，例如图像饱和度。