javascript七基础学习系列九百七十二:给着色器传值

前面定义的每个着色器都需要传入一个值,才能完成工作。要给着色器传值,必须先找到要接收值
的变量。对于uniform 变量,可以调用gl.getUniformLocation()方法。这个方法返回一个对象,表示该uniform 变量在内存中的位置。然后,可以使用这个位置来完成赋值。比如:
let uColor = gl.getUniformLocation(program, “uColor”);
gl.uniform4fv(uColor, [0, 0, 0, 1]);
这个例子从program 中找到uniform 变量uColor,然后返回了它的内存位置。第二行代码调用
gl.uniform4fv()方法给uColor 传入了值。
给顶点着色器传值也是类似的过程。而要获得attribute 变量的位置,可以调用gl.getAttrib-
Location()方法。找到变量的内存地址后,可以像下面这样给它传入值:
let aVertexPosition = gl.getAttribLocation(program, “aVertexPosition”);
gl.enableVertexAttribArray(aVertexPosition);
gl.vertexAttribPointer(aVertexPosition, itemSize, gl.FLOAT, false, 0, 0);
这里,首先取得aVertexPosition 的内存位置,然后使用gl.enableVertexAttribArray()
来启用。最后一行代码创建了一个指向调用gl.bindBuffer()指定的缓冲区的指针,并把它保存在
aVertexPosition 中,从而可以在后面由顶点着色器使用。
调试着色器和程序
与WebGL 中的其他操作类似,着色器操作也可能失败,而且是静默失败。如果想知道发生了什么
错误,则必须手工通过WebGL 上下文获取关于着色器或程序的信息。
对于着色器,可以调用gl.getShaderParameter()方法取得编译之后的编译状态:
if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
alert(gl.getShaderInfoLog(vertexShader));
}
这个例子检查了vertexShader 编译的状态。如果着色器编译成功,则调用gl.getShaderParameter()
会返回true。如果返回false,则说明编译出错了。此时,可以使用gl.getShaderInfoLog()并传
入着色器取得错误。这个方法返回一个字符串消息,表示问题所在。gl.getShaderParameter()和
gl.getShaderInfoLog()既可以用于顶点着色器,也可以用于片段着色器。
着色器程序也可能失败,因此也有类似的方法。gl.getProgramParameter()用于检测状态。最
常见的程序错误发生在链接阶段,为此可以使用以下代码来检查:
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
alert(gl.getProgramInfoLog(program));
}
与gl.getShaderParameter()一样,gl.getProgramParameter()会在链接成功时返回true,
失败时返回false。当然也有一个gl.getProgramInfoLog()方法,可以在程序失败时获取错误
信息。
这些方法主要在开发时用于辅助调试。只要没有外部依赖,在产品环境中就可以放心地删除它们。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值