Three.js 阴影不会投射到场景的一部分上答案

【问题标题】：Three.js Shadow doesn't cast on a part of the sceneThree.js 阴影不会投射到场景的一部分上
【发布时间】：2018-06-02 19:17:41
【问题描述】：

我有这个场景，我在我的计划中用球体投射阴影，在第一张照片中一切都很好。

Picture1

当我把球体放在另一个地方时，阴影没有完全投射在平面上，就像这张照片一样。

Picture2

这是代码：

//Create a DirectionalLight and turn on shadows for the light
var light = new THREE.DirectionalLight( 0xffffff, 0.7, 1 );
light.position.set( 1, 1,1);            
light.castShadow = true;            
light.shadowDarkness = 0.8;
scene.add( light );

//Set up shadow properties for the light
light.shadow.mapSize.width = 512;  
light.shadow.mapSize.height = 512;
light.shadow.camera.near = 0.0;   
light.shadow.camera.far = 5;     


var sphereGeometry = new THREE.SphereBufferGeometry(1, 32, 32 );
var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.translateY(1);
sphere.translateZ(-5);
sphere.translateX(-2);
sphere.castShadow = true; 
sphere.receiveShadow = false;
scene.add( sphere );

在这里我收到了我计划的影子：

var objectLoader = new THREE.ObjectLoader();
objectLoader.load("stone/rush_tex01.json", function ( object ) {    
    object.traverse( function( node ) { if ( node instanceof THREE.Mesh ) { node.receiveShadow = true; } } );
    scene.add( object );
} );

那应该是什么？

【问题讨论】：

标签： three.js

【解决方案1】：

尝试增加定向光的阴影相机的平截头体。代码可能如下所示：

var d = 5;
directionalLight.castShadow = true;
directionalLight.shadow.camera.left = - d;
directionalLight.shadow.camera.right = d;
directionalLight.shadow.camera.top = d;
directionalLight.shadow.camera.bottom = - d;
directionalLight.shadow.camera.near = 1;
directionalLight.shadow.camera.far = 20;

以下示例显示了整个代码。您可能需要调整 d 的值，使其适用于您的特定用例。

https://threejs.org/examples/#webaudio_timing

【讨论】：