我做错了什么与聚光灯和阴影Three.js聚光灯、错了、我做、阴影

2023-09-08 10:52:26 作者:过忘川

我有一个非常简单的场景,有一个.dae网在里面,网格下方的7000 * 7000的平面。我想它由高聚光灯点亮,所以网投在地面上的影子。但是,有些事情似乎被打破!不管有多高,我把聚光灯,它永远不会亮起来了飞机!此外,它点亮网格上只有一点点,而这是在一个小正方形(周长)。

I have a really simple scene which has one .dae mesh in it, and a 7000*7000 plane underneath the mesh. I'd like it to be lit by a high SpotLight, so the mesh throws a shadow on the ground. But, something seems to be broken! No matter how high I put the SpotLight, it never lights up the plane! Also, it lights the mesh up only a little, while it is in a small square (perimeter).

您可以看到这里的情况:

You can see the situation here:

当我移动网(怪物)周围,它不会再被点燃。

As soon as I move the mesh (a monster) around, it wont be lit anymore.

这是我如何实例化光:

// 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

您可以看到影子仍然消失!

You can see how the shadow still disappears!

现在,我究竟做错了什么? AFAIK,光线应​​平等地分散在各个方向!而且,还有一个问题,我似乎无法在现场添加多个射灯!一切都慢下来完全,如果我这样做 - 这是打算?也许是因为我启用了阴影所有的人......

Now, what am I doing wrong here? AFAIK, light should disperse equally in all directions! And also, there is another problem, I seem to be unable to add multiple SpotLights on the scene! Everything slows down completely if I do so - is this intended? Maybe it's because I enabled shadows on all of them...

@Neil,同样的事情发生在你的code以及!

@Neil, the same thing happens in your code as well!

推荐答案

我创建了一个的jsfiddle 显示出与兰伯特材料的​​平面和一个旋转的立方体被蒙上阴影,也许你可以看到什么是不同的你。

I have created a jsfiddle showing a plane with Lambert material and a rotating cube that is casting a shadow, maybe you can see what is different to yours.

修改

尝试演奏有关的一些PARAMS的,我可以停止剪裁上我的演示使用:

Try playing about with some of the params, I can stop the clipping on my demo with:

spotLight.shadowCameraFov = 70;

更新演示动人的演示