在 three.js 着色器中使用灯光答案

【问题标题】：Using lights in three.js shader在 three.js 着色器中使用灯光
【发布时间】：2016-06-06 10:06:43
【问题描述】：

我正在尝试从 three.js 中的着色器访问场景的灯光。

这个问题几乎与Three.js ShaderMaterial issue with lights重复但是关于那个问题的 cmets 并没有帮助我解决这个问题。

这是顶点着色器：

#if NUM_DIR_LIGHTS > 0
    struct DirectionalLight {
        vec3 direction;
        vec3 color;
        int shadow;
        float shadowBias;
        float shadowRadius;
        vec2 shadowMapSize;
     };
     uniform DirectionalLight directionalLights[ NUM_DIR_LIGHTS ];
#endif
  varying vec3 color;
  void main() {
     float r = directionalLights[0].color.r;
     color = vec3(r,1.0,0.0);
     gl_Position = projectionMatrix * modelViewMatrix * vec4(position , 1.0);
  }

以及相关的ShaderMaterial：

var material = new THREE.ShaderMaterial({
    uniforms: THREE.UniformsLib['lights'],
    vertexShader: document.getElementById('vertexShader').innerHTML,
    fragmentShader: document.getElementById('fragmentShader').innerHTML,
    lights : true
  });

我已经在此处发布了整个示例代码：https://jsfiddle.net/zhkvcajs/

删除lights : true 会呈现一个绿色结，但它没有获得应该改变结颜色的directionalLights 信息。显然，lights : true 是必需的，但会导致错误。

【问题讨论】：

标签： three.js shader

【解决方案1】：

如果要使用ShaderMaterial的场景灯，需要设置lights: true。

var material = new THREE.ShaderMaterial( {
    uniforms: uniforms,
    vertexShader: document.getElementById('vertexShader').innerHTML,
    fragmentShader: document.getElementById('fragmentShader').innerHTML,
    lights: true
} );

three.js r.126

【讨论】：

所以，我确实有THREE.UniformsLib[ "lights" ] 作为制服，但没有包括THREE.UniformsLib[ "ambient" ]。似乎很难发现要使用灯光，除了灯光之外，您还需要其他东西。如果你不能在没有环境光的情况下使用灯光，那么为什么环境制服不只是灯光制服的一部分？
我认为可以合理地论证这是一个错误。
已在 r.75dev 中修复。 "ambient"制服已合并到"lights"制服。
太棒了，WL。我在学期中，一有时间就准备整理一份错误报告。感谢您的回答和新修复！