灯光问题(使用三个.js）

Problems with lights (using three.js)

本文关键字：三个 js 问题      更新时间：2023-09-26

我有一个从搅拌机导出的简单室内场景。它有一个房间，天花板上有三个球体，里面有各自的光源。每一个灯光单独工作都很好，但当我将所有灯光插入场景中时，只有一个可以工作！有时与2人合作，但从不与他们三人合作。这是我的灯光代码：

luz_sala1 = new THREE.PointLight(0xFFFFFF,0.5, 50.0);
luz_sala1.position = new THREE.Vector3(16.14323,2.52331,13.93375);
scene.add(luz_sala1);
luz_sala2 = new THREE.PointLight(0xFFFFFF, 0.5, 50.0);
luz_sala2.position = new THREE.Vector3(27.70114,2.52331,-6.20571);
scene.add(luz_sala2);
luz_sala3 = new THREE.PointLight(0xFFFFFF, 0.5, 50.0);
luz_sala3.position = new THREE.Vector3(21.50580,3.10719,-27.82775);
scene.add(luz_sala3);

如果我将距离设置为0，效果会很好，但我需要这些灯光只影响它们所在的区域。我也试过使用THREE.Spotlight（0xFFFFFF，0.5,50.0，Math.PI，0），但结果相同。当灯以某种方式共享相同的距离时，看起来它们相互否定了？

请帮忙，这很令人困惑。

编辑：此外，我在房间的另一部分有一些聚光灯模型（我有大约4个），但当我向场景中添加这4个聚光灯时，我会遇到着色器编译错误。在搜索了这个问题之后，我发现我需要在渲染器中设置maxLights属性。我将其设置为10，但问题仍然存在，场景中的灯光不能超过4个。我还能做什么吗？

编辑2：以下是一些图片。作为参考，"luz_sala1"是离电视更近的，"luz _sala2"是中间的，"lumz _sala3"是离得更远的。

这是上面的代码（所有3盏灯），除了0.8的强度。http://www.mediafire.com/view/?s85qr4rplhort29

这是在打开2和3的情况下（评论为"scene.add（luz_sala1）；"）：http://www.mediafire.com/view/?83qbbua9f8ee3b4

所以，正如你所看到的，2个点光源一起工作很好，但3个点光源似乎"加起来"就是第一个点光源？

maxLight属性没有任何效果很可能是由于您的硬件、驱动程序或ANGLE（将WebGL转换为Direct3D的库）在着色器中不支持足够的可变矢量-每个灯光也需要一个和其他东西。这可能也在您的一般问题的背景中。

为了拥有更多的灯，有三种选择：

  1. 如果你让浏览器更喜欢原生OpenGL而不是ANGLE，试试它是否有帮助（谷歌获取说明）。不过，请确保安装了最新的OpenGL驱动程序
  2. 实现延迟呈现器。如今，这在桌面世界中非常常见，但由于帧缓冲区的限制，在WebGL中实现良好的性能即使不是不可能，也很棘手
  3. 实现一个只使用某些灯光，禁用其余灯光的灯光管理器。最简单但远非完美的方法是选择离相机最近的灯光

同样值得一提的是，目前聚光灯只是向一个方向投射阴影的PointLights。

相关文章：