三.js 地形阴影答案

【问题标题】：Three.js terrain shadowing三.js 地形阴影
【发布时间】：2015-11-06 11:56:52
【问题描述】：

我已经使用平面几何对象制作了一个地形。我设置了一个顶点的 y 坐标来碰撞我的地形。然后我在我的场景中添加了一个定向光，看到“山”等没有阴影。

我还添加了一个球体，发现这个地形上也没有阴影。

var light = new THREE.DirectionalLight(0xffffff, 1);
light.castShadow = true;
light.shadowCameraVisible = true;
light.position.set(-300, 120, -200); // CHANGED
scene.add(light);
scene.add( new THREE.DirectionalLightHelper(light, 0.2) );

Directional light with sphere above the terrain

但是当我用聚光灯代替定向光时，我看到了我想要的地形上的阴影。

var slight = new THREE.SpotLight(0xffffff,1);
slight.position.set(-100,60,100);
slight.shadowCameraVisible = true;
scene.add(slight);
scene.add(new THREE.SpotLightHelper(slight, 0.5));

Spotlight with terrain

所以问题是：

如何制作一个看起来像阳光的灯光，使地形不是平面颜色而是依赖于灯光？（未来它将成为真实城市的一部分）
我应该怎么做才能看到物体在地形上的阴影？（来自小提琴示例：球体的阴影）

谢谢

【问题讨论】：

标签： three.js

【解决方案1】：

您正在修改地形的顶点。这样做时，您还必须修改顶点法线。一种方法是这样的：

geometry.computeVertexNormals();

要创建阴影，您必须启用它们。

renderer.shadowMap.enabled = true;

three.js r.130

【讨论】：