admin 管理员组

文章数量: 1086019

Is it possible to use ImageData array object to get an Image() object. My eventual goal is to use drawImage instead of putImageData since putImageData is too slow (from stackoverflow similar qs and my own tests). All I have is ImageData array that I want to draw on top of an existing image on a canvas .

Is it possible to use ImageData array object to get an Image() object. My eventual goal is to use drawImage instead of putImageData since putImageData is too slow (from stackoverflow similar qs and my own tests). All I have is ImageData array that I want to draw on top of an existing image on a canvas .

  • javascript
  • putimagedata
Share Improve this question edited Feb 8, 2022 at 13:50 Yves M. 31.1k24 gold badges109 silver badges149 bronze badges asked Jul 14, 2016 at 20:49 Captain Jack sparrowCaptain Jack sparrow 1,0373 gold badges15 silver badges29 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 8

You can create an ImageBitmap from an ImageData and pass that to drawImage(). https://developer.mozilla/en-US/docs/Web/API/WindowOrWorkerGlobalScope/createImageBitmap

Something like:

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

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

I was able to do this to scale some ImageData I had, since putImageData does not have arguments for scaling. Unfortunately, it looks like IE, Edge, and Safari do not support createImageBitmap().

It's worth mentioning that for my case (resizing the ImageData), createImageBitmap() does have extra options for resizing the resulting ImageBitmap on its own.

本文标签： javascriptUsing ImageData object in drawImageStack Overflow

版权声明：本文标题：javascript - Using ImageData object in drawImage - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/p/1744053255a2525384.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。