How to access WebGLRenderTarget texture content

3
votes

So I render a scene to a texture and then I need to process the texture in js and either modify the contents or make a new texture from an array of values.

It seems like I need to get the WebGL context and interface directly with WebGL to accomplish this. Does anybody know the best way to do this?

1
three.jsrender-to-texturerendertarget
It would help if you added some of your code. - Blubberguy22
what do you mean by process the texture/modify the contents/make a new texture from an array ? I suppose what you need is rendertarget + fragment shader - Mouloud88

1 Answers

5
votes

I ended up just getting the webGL context from the renderer and calling gl.readPixels()

var gl = renderer.getContext();
var framebuffer = renderTarget.__webglFramebuffer;
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
var data = new Uint8Array(renderTarget.width * renderTarget.height * 4);
gl.readPixels(0,0,renderTarget.width,renderTarget.heigh,gl.RGBA,gl.UNSIGNED_BYTE,data);

(renderTarget is an instance of THREE.WebGLRenderTarget)