javascript - 在 drawImage 中使用 ImageData 对象

Question

是否可以使用ImageData数组对象来获取 Image() 对象。我的最终目标是使用drawImage，而不是putImageData因为putImageData太慢（来自 stackoverflow 类似的 qs 和我自己的测试）。我所拥有的只是ImageData我想在 canvas 上的现有图像之上绘制的数组。

Answer 1

您可以ImageBitmap从 an创建一个ImageData并将其传递给drawImage(). https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/createImageBitmap

就像是：

const imgdata = ...;
const ctx = ...;

createImageBitmap(imgdata).then(function(imgBitmap) {
    ctx.drawImage(imgBitmap, ...remaining args);
});

我能够做到这一点来扩展ImageData我拥有的一些，因为putImageData没有缩放的论据。不幸的是，IE、Edge 和 Safari 似乎不支持createImageBitmap().

值得一提的是，对于我的情况（调整 的大小ImageData），createImageBitmap()确实有额外的选项可以ImageBitmap自行调整结果的大小。