THREEJS-阴影伪影-IOS设备

时间:2018-06-20 09:51:48

标签: ios three.js webgl

我仅在IOS设备上有奇怪的阴影伪像,如下所示。阴影可以在台式机和Android上正常工作。这不是一个偏见问题,也不是一个自我阴影问题(尽管看起来确实如此),因为我知道法线是正确的并且没有双面。它仅在IOS设备(经过测试的iPhone 6、8、10和ipad air 1、2)上发生。有没有人遇到过类似的问题(除了偏见和自我遮蔽之外)?

编辑:为了使其他可能遇到相同问题的人更加清楚。光线的方向是从房子的正面看房子的背面(位于截屏位置的相反方向,并朝向后院),因此,背面的屋顶(截取的屏幕截图)应完全处于阴影中。但是,正如您在图片中看到的那样,地面上的阴影是正确的,但屋顶上的阴影被切除了,只有一部分处于阴影中。

实时演示,您可以在此处看到问题(问题仅在IOS设备上发生):https://expivi.expivi.net/product/house-demo(我将在几天内应用解决方案,并在出现问题时在此处说明不再可见)

解决方案,如下所述,该问题来自Threejs阴影摄像机的默认值。假设度量较大,请将阴影摄影机的近平面设置为0.5。

enter image description here

1 个答案:

答案 0 :(得分:1)

Threejs似乎默认将阴影贴图的camera的近值设置为0.5。 IOS上浮点精度低和我们使用的指标结合在一起导致了问题。 设置lightObject.shadow.camera.near = 0.01;解决了这个问题。