如何提高 Three.js 中的阴影质量

Question

我在一个场景中有几个对象。我希望它们在一个宽阔的平面上移动，这样会受到阴影。如果我只使用一个点光源或一个非常大的定向光源，物体移动到角落时的阴影将变得非常粗糙（粗糙的阴影边缘）。像这样：\n

\n\n

所以我\xe2\x80\x99m想知道我是否应该为它们上方的每个物体使用灯光并跟随它们以投射高质量的阴影边缘？在某些情况下，我无法将shadow.mapsize设置得更高。

\n

Answer 1

有很多因素可以控制阴影质量。

在我看来，你的影子相机左/右/上/下设置得太大，并且它在太大的区域上投射阴影。

阴影投射灯非常昂贵，因此我会避免尝试通过使用多个灯来进行补偿。

尝试减少 light.shadow.camera 左/右/上/下，以使地图更好地聚焦于物体所在的位置。还尝试将阴影贴图大小增加到 1024 或 2048 平方之类的值。

另一件有用的事情是使用 THREE.PCFShadowmapping 而不是默认值。这将使阴影的边缘变得平滑。

编辑：另请查看 PCFSoftShadowMapping.. 渲染速度较慢，但可以极大地平滑阴影边缘。

获得正确的阴影贴图是一个棘手的过程，需要大量的摆弄。

另外，尝试将 DirectionalLightHelper 连接到您的灯光，并将 CameraHelper 连接到灯光相机。这些将帮助您弄清楚阴影投射区域有多大以及物体指向哪里。

是的...这是一种常见的技术，让方向光跟随相机或聚焦的物体...就像赛车游戏中的汽车或主角...您可能遇到的一个问题是移动定向相机会导致阴影边缘闪烁。当定向光距离目标对象达到一定阈值时，您可以通过仅移动定向光来避免这种效果。我在我正在开发的赛车游戏中这样做了，效果很好。 (2认同)