我做错了什么与聚光灯和阴影Three.js [英] I'm doing something wrong with SpotLights and shadows in Three.js
问题描述
我有一个非常简单的场景,有一个.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;
这篇关于我做错了什么与聚光灯和阴影Three.js的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!