Windows 应用：使用 javascript 从预览帧获取像素数据

Question

我正在使用 WinJs 创建一个带有 javascript 的应用程序来获取相机预览。通过预览，我得到了一个视频帧，但现在我想获取所有像素 rgba 数据以计算平均颜色和其他信息。我使用 Media.Capture class 的 getPreviewFrameAsync 方法。对吗？

 mediaCapture.getPreviewFrameAsync(videoFrame)
    .then(function (currentFrame) {
         //get pixeldata rgba of frame of camerapreview
         
     }

这些 class 中的 javascript 中的文档非常差.... 谢谢

工程设计

Answer 1

I use getPreviewFrameAsync method of Media.Capture class. Is it right?

是的，有了这个你可以获得videoframe object. After then, you can get the SoftwareBitmap object which contains the pixel data by VideoFrame.SoftwareBitmap属性。代码如下：

return oMediaCapture.getPreviewFrameAsync(videoFrame)
.then(function (currentFrame) {
    // Collect the resulting frame
    var frameBitmap = currentFrame.softwareBitmap;
    // Show the frame information
    frameInfoTextBlock.textContent = frameBitmap.pixelWidth + "x" + frameBitmap.pixelHeight + " " +
        stringOfEnumeration(Windows.Graphics.DirectX.DirectXPixelFormat, frameBitmap.bitmapPixelFormat);

官方示例CameraGetPreviewFrame提供了用javascript语言编写的例子，里面有你想要的功能的例子可以参考。

Windows 应用：使用 javascript 从预览帧获取像素数据

Windows app: get pixeldata from preview frame with javascript

javascript

windows-runtime

winjs

win-universal-app