War*_*ith 6 javascript shader opengl-es webgl opengl-es-2.0
我正在尝试在我的着色器中实现多个灯光但是我无法用我的光数据填充制服.
我的顶点着色器:
attribute vec3 aVertex;
attribute vec3 aNormal;
attribute vec2 aTexture;
uniform mat4 uMVMatrix;
uniform mat4 uPMatrix;
uniform mat4 uNMatrix;
uniform vec3 uAmbientColor;
uniform vec3 uPointLightingLocation[16];
uniform vec3 uPointLightingColor[16];
varying vec2 vTexture;
varying vec3 vLightWeighting;
void main(void) {
vec4 mvPosition = uMVMatrix * vec4(aVertex, 1.0);
gl_Position = uPMatrix * mvPosition;
vTexture = aTexture;
int i;
for (i = 0; i < 16; i++) {
vec3 lightDirection = normalize(uPointLightingLocation[i] - mvPosition.xyz);
vec4 transformedNormal = uNMatrix * vec4(aNormal, 1.0);
float directionalLightWeighting = max(dot(transformedNormal.xyz, lightDirection), 0.0);
if (i == 0) {
vLightWeighting = uAmbientColor + uPointLightingColor[i] * directionalLightWeighting;
} else {
vLightWeighting = vLightWeighting * (uAmbientColor + uPointLightingColor[i] * directionalLightWeighting);
}
}
}
Run Code Online (Sandbox Code Playgroud)
仅显示最新灯光的代码:
for (var light in this.lightsDirection) {
gl.uniform3fv(this.shaderProgram.pointLightingLocationUniform, this.lightsDirection[light]);
gl.uniform3fv(this.shaderProgram.pointLightingColorUniform, this.lightsColor[light]);
}
Run Code Online (Sandbox Code Playgroud)
由于制服uPointLightingLocation是一个大小为16的vec3阵列,我认为可以将整个阵列传递给制服,但我没有工作解决方案.
当我尝试传递完整的数组this.lightsColor(没有索引)时,我看不到任何光.
Jac*_*hee 12
gl.uniform3fv期望一个扁平的浮点数组.此外,您使用相同的统一位置多次调用它.所以,最后一个获胜.想象一下,uniform3fv是一个低级复制命令,你给它(目标,源).它只是将缓冲区从一个地方复制到另一个地方.
假设您的示例只有3个灯,您可以这样统一分配位置:
var locations = [
1.0, 0, 0,
0, 1.0, 0,
0, 0, 0
];
gl.uniform3fv(shaderProgram.pointLightingLocationUniform, locations);
Run Code Online (Sandbox Code Playgroud)
当你调试这样的问题时,我还建议使用更简单的着色器.在顶点着色器中使用以下内容:
for (int i = 0; i < 3; i++) {
vColor += uPointLightingLocation[i];
}
Run Code Online (Sandbox Code Playgroud)
片段着色器:
gl_FragColor = vec4(vColor, 1);
Run Code Online (Sandbox Code Playgroud)
然后,如果你的多边形是黄色的,你知道它正在工作.
| 归档时间: |
|
| 查看次数: |
14573 次 |
| 最近记录: |