多个纹理时activeTexture与bindTexture的顺序问题——WebGL开发中的问题记录（1）

此系列文章用于记录我使用WebGL开发3D引擎时遇到的问题和解决方案（也可能暂未解决）。

项目demo地址：cool.js

项目源码地址：cool.js——码云

----------------------正文分割线---------------------------------

为第一次写博客干杯庆祝！

要在一个着色器程序(shader program)中使用2个纹理(texture)，首先需要在片元着色器中定义2个sampler2D类型的uniform

uniform sampler2D u_Sampler;
uniform sampler2D u_ShadowMap;

然后分别创建两个纹理对象，绑定，传值。分别绑定到0号、1号纹理单元。

//第一个texture
var texture1 = gl.createTexture();

gl.activeTexture(gl.TEXTURE1); //必须在bindTexture之前
gl.bindTexture(gl.TEXTURE_2D, texture1);

var u_Sampler = gl.getUniformLocation(gl.program, 'u_Sampler');
gl.uniform1i(u_Sampler, 1);


//第二个texture
var texture0 = gl.createTexture();

gl.activeTexture(gl.TEXTURE0); //必须在bindTexture之前
gl.bindTexture(gl.TEXTURE_2D, texture0);

var u_ShadowMap = gl.getUniformLocation(gl.program, 'u_ShadowMap');
gl.uniform1i(u_ShadowMap, 0);

划重点：activeTexture必须在bindTexture之前。如果没activeTexture就bindTexture，会默认绑定到0号纹理单元！

做阴影贴图时出不来，查了半天，记下来。

转载请注明出处：微笑君的博客