Question

我需要渲染2个纹理（当然是通过）

var extbuffers = gl.getExtension('WEBGL_draw_buffers');

var tex1 = gl.createTexture();  
//gl.activeTexture(gl.TEXTURE1);  
gl.bindTexture(gl.TEXTURE_2D, tex1);  
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, PVS, PVS, 0, gl.RGBA,gl.FLOAT,null);


var tex2 = gl.createTexture();
//gl.activeTexture(gl.TEXTURE2);  
gl.bindTexture(gl.TEXTURE_2D, tex2);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, PVS, PVS, 0, gl.RGBA, gl.FLOAT, null);  



gl.bindFramebuffer(gl.FRAMEBUFFER, gl.createFramebuffer());
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex1, 0);  

gl.framebufferTexture2D(gl.FRAMEBUFFER, extbuffers.COLOR_ATTACHMENT1_WEBGL, gl.TEXTURE_2D, tex2, 0);

extbuffers.drawBuffersWEBGL(
// Here, we give it the list of slots we want to draw to.
[
    extbuffers.COLOR_ATTACHMENT0_WEBGL, // gl_FragData[0]
    extbuffers.COLOR_ATTACHMENT1_WEBGL  // gl_FragData[1]
]
);

和片段着色器：

#extension GL_EXT_draw_buffers : require

void main() {

                gl_FragData[0] = vec4(pos,vit);
                gl_FragData[1] = vec4(col,1.0);
}

但现在是我的问题：我如何读取纹理？我读过一些类似的问题，但关于FramebufferRenderbuffer

我想要一个：

gl.readBuffer(gl.COLOR_ATTACHMENT0);
gl.readPixels(...);

gl.readBuffer(gl.COLOR_ATTACHMENT1);
gl.readPixels(...);

谢谢。

编辑：我使用Webgl 1，但扩展名为 ad WEBGL_draw_buffers

Answer 1

创建更多帧缓冲区，将纹理分别附加到这些帧缓冲区，并在要从纹理读取时绑定这些帧缓冲区。

有效

create texture1
create texture2

create drawFramebuffer
   attach texture1 as color attachment0
   attach texture2 as color attachment1

create readFramebuffer1
   attach texture1 as color attachment0

create readFramebuffer2
   attach texture2 as color attachment0

现在，您要绘制时绑定drawFramebuffer，要从texture1读取时绑定readFrambuffer1，而要从texture2读取时绑定readFrameubffer2

相当于webgl 1.0中的gl.readBuffer（gl.COLOR_ATTACHMENTx）

1 个答案: