ThreeJS 不会投射任何阴影答案

【问题标题】：ThreeJS won't cast any shadowsThreeJS 不会投射任何阴影
【发布时间】：2015-11-11 20:06:52
【问题描述】：

我在使用 ThreeJS 时遇到了一些问题。我有一些立方体，应该在下面的飞机上投射阴影，但它们没有 - 我已经在谷歌上搜索了几个小时的解决方案，并尝试了我能找到的所有东西，但我无法做到工作。

我在所有对象上都使用MeshPhongMaterial，并且我已将.castShadow 和.receiveShadow 添加到所有适当的对象中。我使用SpotLight，指向地面 - 它照亮立方体和地面，但立方体不会投射阴影。这是一个立方体和地面的例子：

  var cubeGeometry = new THREE.CubeGeometry(20, 20, 20);
  cube1 = new THREE.Mesh(cubeGeometry, material);
  cube1.shading = THREE.FlatShading;
  cube1.castShadow = true;
  cube1.receiveShadow = true;
  var groundGeometry = new THREE.PlaneGeometry(200, 200);
  var groundMaterial = new THREE.MeshPhongMaterial({color: 0xf0dc3f});
  ground = new THREE.Mesh(groundGeometry, groundMaterial);
  ground.shading = THREE.FlatShading;
  ground.position.y = -30;
  ground.rotation.x = Math.PI / 2;
  ground.rotation.z = Math.PI / 4;
  ground.receiveShadow = true;

还有我的 JsFiddle：https://jsfiddle.net/fggjp2n9/

【问题讨论】：

标签： javascript three.js

【解决方案1】：

你不见了：

renderer.shadowMap.enabled = true;

https://jsfiddle.net/fggjp2n9/1/

【讨论】：

如果你设置ground.castShadow = false;，它将从地面上移除丑陋的矩形。