Question

所以在我的代码的javascript部分，这里是实际上向顶点和片段着色器发送像素数组的片段 - 但是当我到达那些着色器时我只使用1个纹理 - 无论如何我在那里可以一次发送两个纹理？如果是这样，我怎么能在代码的GLSL方面'捕获'它们？

        if (it > 0){

            gl.activeTexture(gl.TEXTURE1);

            gl.bindTexture(gl.TEXTURE_2D, texture);

            gl.activeTexture(gl.TEXTURE0);

            gl.bindFramebuffer(gl.FRAMEBUFFER, FBO2);}

        else{

            gl.activeTexture(gl.TEXTURE1);

            gl.bindTexture(gl.TEXTURE_2D, texture2);

            gl.activeTexture(gl.TEXTURE0);

            gl.bindFramebuffer(gl.FRAMEBUFFER, FBO);}

        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);

Answer 1

通过声明多个采样器制服来引用GLSL中的多个纹理

uniform sampler2D u_myFirstTexture;
uniform sampler2D u_mySecondTexture;

...

vec4 colorFrom1stTexture = texture2D(u_myFirstTexture, someUVCoords); 
vec4 colorFrom2ndTexture = texture2D(u_mySecondTexture, someOtherUVCoords);

您可以通过调用{/ 1}}来确定这两个采样器使用的纹理单元，如

gl.uniform1i

您可以使用var location1 = gl.getUniformLocation(program, "u_myFirstTexture"); var location2 = gl.getUniformLocation(program, "u_mySecondTexture"); ... // tell u_myFirstTexture to use texture unit #7 gl.uniform1i(location1, 7); // tell u_mySecondTexture to use texture unit #4 gl.uniform1i(location2, 4);和gl.activeTexture

设置纹理单位

gl.bindTexture

如何在WebGL中将多个纹理发送到片段着色器？

1 个答案: