CODEWITHSUNDEEP
javascriptcanvaswebglaframe
Neko Neko
Neko Neko

Reputation: 21

aframe:How to get pixels from canvas

I want to read and process the pixel data rendered in a-frame. I tried the code below

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
    );

But the pixels array was left of 0, 0, 0, 0 How can I read the pixel data on the canvas? I'd appreciate it if you could answer this problem

Upvotes: 2

Views: 524

Answers (1)

emackey
emackey

Reputation: 12448

In the demo you posted, find and put a breakpoint on the line that says:

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

Take a look at attributes, it's an options object, and among other settings it contains this option:

    preserveDrawingBuffer: false

Although your original post shows you manually setting this option to true, your option has not carried through into the demo you posted. If you can make this option take effect, you should be able to read the pixels back.

Upvotes: 1

Related Questions