Three.js - 阴影投射的异常

时间:2013-08-02 07:23:32

标签: javascript three.js shadow

我有这段代码:

  var other_phongMaterial   = new THREE.MeshPhongMaterial({ color: 0xf455f4 });      
  var other_sphere = new THREE.Mesh(new THREE.SphereGeometry(50, 50, 50), other_phongMaterial );
  var other_cube = new THREE.Mesh(new THREE.CubeGeometry(200, 200, 200), other_phongMaterial );

  var phongMaterial = new THREE.MeshPhongMaterial({ color: 0xcccccc });
  var sphere = new THREE.Mesh(new THREE.SphereGeometry(50, 50, 50), phongMaterial );
  var cube = new THREE.Mesh(new THREE.CubeGeometry(200, 200, 200), phongMaterial );


  sphere.castShadow = true;
  cube.receiveShadow = true;
  other_sphere.castShadow = true;
  other_cube.receiveShadow = true;

  sphere.position.set(0,250,-130);
  other_cube.position.set(0,50,-150);

  other_sphere.position.set(0,250,130);
  cube.position.set(0,50,150);

  scene.add(cube);
  scene.add(sphere);
  scene.add(other_sphere);
  scene.add(other_cube);    

  var spotLight = new THREE.SpotLight( 0xffffff );
  spotLight.position.set( 100, 1000, 100 );

  spotLight.castShadow = true;
  spotLight.shadowMapWidth = 1024;
  spotLight.shadowMapHeight = 1024;

  spotLight.shadowCameraNear = 500;
  spotLight.shadowCameraFar = 4000;
  spotLight.shadowCameraFov = 30;

  scene.add( spotLight );

并且,我无法理解为什么阴影投射仅适用于一个。我注意到以下几点:
- 如果我尝试更换立方体,阴影将投射在一个上,但仍然不会投射在另一个上 - 如果我使用与other_cube相同的材料,它将起作用,这意味着现在它就像这样对我有用,相反,如果我使用两种不同的材料,它只会在other_cube上施放。
但这些形状的设置完全相同!所以..我想不通,真的..提前谢谢!

编辑:可能还有其他我不记得的异常情况,所以请在每种情况下告诉我。

1 个答案:

答案 0 :(得分:0)

也许你的other_cube不在影子相机视锥内。您应该可以通过设置spotLight.shadowCameraVisible = true;来查看阴影相机尺寸。只有该锥体内的对象才会计算出阴影。然后移动立方体或相应地调整阴影相机属性。阴影可能有点棘手,问题可能完全不同。但我首先要检查一下。