View Full Version : Multitexture intro

12-17-2010, 05:22 PM
I am learning to use multitexture on WebGL. I'd like to do the following:

Pass 2 textures to the shader: texture0 and texture1
Display texture0 if I access texture0
Display texture1 if I access texture1

I have the following fragment shader code snippet:

uniform sampler2D texture0;
uniform sampler2D texture1;

varying vec2 v_texCoord;

void main()

vec2 texCoord = vec2(v_texCoord.s, 1.0 - v_texCoord.t);
vec4 texel0 = texture2D(texture0, texCoord);
vec4 texel1 = texture2D(texture1, texCoord);

gl_FragColor = vec4(texel0.xyz, texel0.a);

I have the following JavaScript code snippet:

// Activate 2 textures
gl.uniform1i(gl.getUniformLocation(gl.program, "texture0"), 0);
gl.bindTexture(gl.TEXTURE_2D, photoTexture0);

gl.uniform1i(gl.getUniformLocation(gl.program, "texture1"), 0);
gl.bindTexture(gl.TEXTURE_2D, photoTexture1);

The above code always displays texture1 regardless

gl_FragColor = vec4(texel0.xyz, texel0.a);

or (notice the above code accesses texel0 of texture0 and below code accesses texel1 of texture1)

gl_FragColor = vec4(texel1.xyz, texel1.a);

Since the above code does not work as I expected and I am new on this, I am wondering if I have done something wrong or I misunderstand the concept.

Any help is appreciated. Thanks in advance for your help.

12-17-2010, 05:57 PM
I have just changed

// Changed from 0 to 1
gl.uniform1i(gl.getUniformLocation(gl.program, "texture1"), 1);

Unfortunately, it still does not work as expected.

12-18-2010, 06:53 AM
I found and fixed the problem

gl.activeTexture(gl.TEXTURE0); // remove the "GL_" on GL_TEXTURE0
gl.bindTexture(gl.TEXTURE_2D, photoTexture0);

gl.uniform1i(gl.getUniformLocation(gl.program, "texture1"), 0);
gl.activeTexture(gl.TEXTURE1); // remove the "GL_" on GL_TEXTURE1

I cut'n'paste the GL_TEXTURE0 from an example written in C language.

09-13-2012, 11:27 AM
Hello pion,
I am learning webgl and am trying to do a multi-texture as well. Is there any way you can post your full working code as an example?