Question

我正在尝试使用THREE.js创建一个小项目，但我需要使用draw_buffers扩展。我一直在寻找，我一无所获。所以我想知道是否有办法直接使用draw_buffers扩展名？

修改我的想法是，如果我有一个片段着色器，如：

#extension GL_EXT_draw_buffers : require
// varyings and uniforms

void main(){
     gl_FragData[0] = // some data here
     gl_FragData[1] = // some other data here
     // other rendertargets
}

由于每个gl_FragData附加到纹理，我如何将这些纹理传递/转换为THREE.js纹理？

Answer 1

我终于找到了解决方法。

我首先这样做：

    texture = new THREE.Texture();
    texture.__webglTexture = gl.createTexture();
    gl.bindTexture(gl.TEXTURE_2D, texture.__webglTexture );
    texture.__webglInit = false;
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
    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, size, size, 0, gl.RGBA, gl.FLOAT, null);
    gl.bindTexture( gl.TEXTURE_2D, null )

然后我可以简单地将纹理绑定到帧缓冲区：

   gl.framebufferTexture2D(gl.FRAMEBUFFER, COLOR_ATTACHMENT0_WEBGL, gl.TEXTURE_2D, texture1.__webglTexture, 0);
   gl.framebufferTexture2D(gl.FRAMEBUFFER, COLOR_ATTACHMENT1_WEBGL, gl.TEXTURE_2D, texture2.__webglTexture , 0);
   // Any other texture that i need

然后我可以简单地说：

    gl.bindFramebuffer(gl.FRAMEBUFFER,FBO[0]); 

    renderer.setSize(size,size);
    renderer.render(scene,camera);

    shaderSwap();
    renderer.setSize(window.innerWidth,window.innerHeight)

    gl.bindFramebuffer(gl.FRAMEBUFFER,null)

然后在第二遍中我只需要将纹理作为制服。

可以在THREE.js中使用draw_buffer扩展吗？

1 个答案: