Question

我有这段代码：

var FSHADER_SOURCE = `
  precision mediump float;
  uniform vec4 u_FragColor;

  void main() {
    gl_FragColor = u_FragColor;
  }`;

还有一个为片段着色器更改颜色的函数：

var gl = getWebGLContext(canvas);
var u_FragColor = gl.getUniformLocation(gl.program, 'u_FragColor');

// lines to set rgb
gl.uniform4f(u_FragColor, rgb[0], rgb[1], rgb[2], rgb[3]);

很奇怪，我可以看到rgb设置为[0,1,0,1]之类的东西，但是片段着色器的颜色还是黑色。即使我将代码更改为：

// still black
gl.uniform4f(u_FragColor, 0.0, 1.0, 0.0, 1.0);

更改颜色的唯一方法是不使用u_FragColor即可直接修改rgb通道。我在这里想念什么？

如果有帮助，还可以在gist上找到完整的代码。

Answer 1

如果我正在执行以下操作，它将对我有用：

var color = new Float32Array([rgb[0], rgb[1], rgb[2], rgb[3]]);

...然后：

gl.uniform4fv(program.uniforms['u_fragColor'], color);

所以，我认为这里的问题只是uniform4f内部的转换，而不是uniform4fv。

请注意，稍后您可以直接将颜色分量设置为Float32Array，而不必每次都分配一个新的颜色分量。

Answer 2

在链接程序后，可以获得活动程序资源，例如统一变量的位置：

gl.linkProgram(gl.program);
var u_FragColor = gl.getUniformLocation(gl.program, 'u_FragColor');

但是，要设置统一变量的值，必须将该程序安装为当前程序。 uniform*将值设置为与当前使用的程序的位置相关联的统一。请注意，gl.uniform4f没有该程序的参数，受影响的程序是当前程序：

gl.useProgram(gl.program);
gl.uniform4f(u_FragColor, rgb[0], rgb[1], rgb[2], rgb[3]);

WebGL片段着色器颜色不起作用

2 个答案: