此系列文章用于记录我使用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号纹理单元!
做阴影贴图时出不来,查了半天,记下来。
转载请注明出处:微笑君的博客