Question

我想读取和处理在一帧中渲染的像素数据。我尝试了下面的代码

var canvas = document.querySelector('canvas'),
params = {
    preserveDrawingBuffer: true,
},
gl = canvas.getContext('experimental-webgl', params);
var pixels = new Uint8Array(canvas.width * canvas.height * 4);
gl.readPixels(
    0,
    0,
    canvas.width,
    canvas.height,
    WebGLRenderingContext.RGBA,
    WebGLRenderingContext.UNSIGNED_BYTE,
    pixels
    );

但是像素阵列保留为0,0,0,0 如何读取画布上的像素数据？如果你能回答这个问题，我会很感激

Answer 1

在the demo you posted中，在行上找到并设置断点：

    _gl = _context || _canvas.getContext( 'webgl', attributes )

查看attributes，它是一个选项对象，在其他设置中包含此选项：

    preserveDrawingBuffer: false

虽然您的原始帖子显示您手动将此选项设置为true，但您的选项尚未贯彻到您发布的演示中。如果您可以使此选项生效，您应该能够读回像素。

aframe：如何从画布中获取像素

1 个答案: