ShaderMaterial雾参数不起作用

Question

我在制作场景迷雾时遇到了麻烦THREE.ShaderMaterial.目前,雾仅影响其他几何,但使用THREE.ShaderMaterial创建的天幕不受雾的影响.

fogShaderMaterial中似乎有一个布尔参数,显然应将其设置为true以使用场景雾.uniforms.fogColor is undefined然而,使用它会导致错误.错误发生在WebGLRenderer功能上refreshUniformsFog.

这是一个错误还是我使用参数错误？

基于webgl_materials_lightmap.html示例的测试用例:http://jsfiddle.net/HXhb4/ 如果在第62行将雾设置为true并运行测试,则会出现错误.我想要发生的是被雾影响的天幕,就像使用普通MeshPhongMaterial创建的模型或天幕一样.

Answer 1

如果要在自定义中使用雾ShaderMaterial,则需要确保指定所需的雾uniforms.例如,

var uniforms = {
    topColor:    { type: "c", value: new THREE.Color( 0x0077ff ) },
    bottomColor: { type: "c", value: new THREE.Color( 0xffffff ) },
    offset:      { type: "f", value: 33 },
    exponent:    { type: "f", value: 0.6 },
    fogColor:    { type: "c", value: scene.fog.color },
    fogNear:     { type: "f", value: scene.fog.near },
    fogFar:      { type: "f", value: scene.fog.far }
}

var skyMat = new THREE.ShaderMaterial( {
    vertexShader: vertexShader,
    fragmentShader: fragmentShader,
    uniforms: uniforms,
    side: THREE.BackSide,
    fog: true
} );

同时指定fogDensity您是否决定使用它.您还必须将雾逻辑合并到着色器中.

three.js r.59