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

【问题标题】：aframe:How to get pixels from canvasaframe：如何从画布中获取像素
【发布时间】：2016-11-16 02:26:20
【问题描述】：

我想读取和处理在 a-frame 中呈现的像素数据。我尝试了下面的代码

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 如何读取画布上的像素数据？如果你能回答这个问题，我将不胜感激

【问题讨论】：

left of 0, 0, 0, 0 什么意思？你为什么要处理四维空间？
也许这会有所帮助 - stackoverflow.com/questions/17981163/…
当然是0,0,0,0。您创建了一个新的画布并且没有对其进行任何渲染。它开始于0,0,0,0。有什么问题？
像素数组是一维的。而且我也参考了Dex先生提供的链接，但是由于无法解决，所以在这里提出了一个新问题。我正在使用基于标签的VR创建框架“A-FRAME”参考链接link我想读取这个框架创建的屏幕的像素数据。

标签： javascript canvas webgl aframe

【解决方案1】：

在the demo you posted 中，找到并在以下行放置一个断点：

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

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

    preserveDrawingBuffer: false

虽然您的原始帖子显示您手动将此选项设置为true，但您的选项并未体现在您发布的演示中。如果你能让这个选项生效，你应该可以把像素读回来。

【讨论】：