WebGL - lectura de los datos de píxeles de rendir memoria intermedia

Question

¿Hay una manera de obtener los datos de los píxeles en bruto de un WebGL hacen buffer de memoria intermedia o marco que está fuera de la pantalla?

estoy usando WebGL para hacer algo de procesamiento de imágenes, por ejemplo, borrando una imagen, para igualar el color, etc. estoy usando marcos de memoria para hacer a las texturas en el tamaño de la imagen completa, a continuación, utilizando esa textura que se mostrará en la ventana gráfica en un tamaño más pequeño. ¿Puedo obtener los datos de píxel de un búfer o textura para que pueda trabajar con él en un contexto 2d de lienzo normal? ¿O estoy atascado con cambiar la ventana gráfica al tamaño de imagen completo y tomar los datos con canvas.toDataURL()?

Gracias.

Answer 1

Esto es muy vieja pregunta, pero he buscado lo mismo en three.js recientemente. No hay una forma directa de renderizar en el búfer de cuadros, pero en realidad se realiza por proceso de renderizado a textura (RTT). Compruebo el código fuente del marco y descubro el siguiente código:

renderer.render(rttScene, rttCamera, rttTexture, true); 

// ... 

var width = rttTexture.width; 
var height = rttTexture.height; 
var pixels = new Uint8Array(4 * width * height); // be careful - allocate memory only once 

// ... 

var gl = renderer.context; 
var framebuffer = rttTexture.__webglFramebuffer; 
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);   
gl.viewport(0, 0, width, height); 
gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels); 
gl.bindFramebuffer(gl.FRAMEBUFFER, null); 

Answer 2

readPixels() debe hacer lo que quiera. Leer más en la especificación WebGL en http://www.khronos.org/registry/webgl/specs/latest/