我在Three.js中使用SpotLights和阴影做错了

Question

我有一个非常简单的场景，其中有一个.dae网格，网格下面有一个7000 * 7000平面。我希望它被高SpotLight点亮，因此网格会在地面上投下阴影。但是，似乎有些事情被破坏了！无论我放SpotLight多高，它都不会照亮飞机！此外，它只是稍微点亮网格，而它是一个小方块（周边）。

你可以在这里看到情况：

一旦我移动网格（怪物），它就不再被点亮了。

这是我实例化灯光的方式：

// create a spotlight
self.spotLight = new THREE.SpotLight();

// set its position
self.spotLight.position.y = 1000; //I recon it needs to be relatively high so it lights up everything
self.spotLight.position.x = 0; //(0, 0) are the coordinates where the mesh is spawned, and are the center of the plane
self.spotLight.position.z = 0;
self.spotLight.castShadow = true;

这就是飞机的制作方式：

//The plane.
self.plane = new THREE.Mesh(new THREE.PlaneGeometry(self.groundSize, self.groundSize), new THREE.MeshLambertMaterial({color: 0x5C8A00}));
self.plane.receiveShadow = true;
self.plane.position.x = 0;
self.plane.position.y = -26;
self.plane.position.z = 0;

另外，这是另一张图片，这一次，我添加了很多PointLights：

你可以看到阴影是如何消失的！

现在，我在这里做错了什么？ AFAIK，光应该在所有方向均匀分散！而且，还有另一个问题，我似乎无法在场景中添加多个SpotLights！如果我这样做，一切都会完全放慢 - 这是有意的吗？也许是因为我在所有人身上都启用了阴影......

@Neil，你的代码也会发生同样的事情！

Answer 1

我创建了一个jsfiddle，显示了一个带有Lambert材质的平面和一个投射阴影的旋转立方体，也许你可以看到与你不同的东西。

修改

尝试使用某些参数进行游戏，我可以使用以下命令停止剪辑：

spotLight.shadowCameraFov = 70;

更新demo并移动demo