有没有可能在没有画布的情况下从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);

然后我格式化imageData

我在想，也许有办法不使用画布就能从ImageBitMap获取数据？但到目前为止找不到任何解决方法。有人对这个愚蠢的问题有聪明的答案吗？

谢谢！

Answer 1

不，目前还没有办法。

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

(ImageBitmaps可以表示许多不同的源代码，这些源代码在内部存储在不同的位置，具有不同的回读权衡)。

因此，目前唯一的解决方案确实是通过画布。

在不久的将来，可能比ImageBitmap.getImageData更接近，您将能够从MediaStream中提取VideoFrames并将其直接绘制到画布上，如this answer of mine中所示，从而避免ImageBitmap步骤，甚至可以读取每个帧的YUV平面，如this answer of mine中所示。