是否可以在没有 canvas 的情况下从 ImageBitMap Web 对象获取像素？

Question

我需要在 js 中管理来自网络摄像头的像素。我需要 Uint8ClampedArray 格式的它们。到目前为止我做到了

this.imageCapture.grabFrame()
        .then(imageBitmap => {
            this.context2d.drawImage(imageBitmap, 0, 0,imageBitmap.width, imageBitmap.height);
        })

然后我用

得到像素

this.context2d.getImageData(0,0,this._videoCanvas.width,this._videoCanvas.height);

然后我格式化图像数据

我在想是否有办法在不使用 canvas 的情况下从 ImageBitMap 获取数据？但到目前为止找不到任何解决方法。有人对这个愚蠢的问题有聪明的答案吗？

谢谢！

Answer 1

不行，目前没有办法。

我们正在努力在 ImageBitmap 接口上添加一个新的 getImageData() 方法 specs issue 但这仍然需要实现者的兴趣，有人来编写规范，并且可能需要大量讨论，因为其中的所有内容没那么容易。

（ImageBitmaps 可以表示许多不同的来源，这些来源内部存储在不同的地方，并为回读进行了各种权衡）。

所以目前唯一的解决办法确实是通过canvas.

在不久的将来，可能比 ImageBitmap.getImageData 更近，您将能够从 MediaStream 中提取 VideoFrames 并将其直接绘制到 canvas，如 , thus avoiding the ImageBitmap step, or even read the YUV planes of each frame as demonstrated in 所示。

是否可以在没有 canvas 的情况下从 ImageBitMap Web 对象获取像素？

Is it possible to get pixels from ImageBitMap web object without a canvas?

canvas

imagebitmap