three.js - 软阴影具有意外偏移

我目前正在研究一种柔和/模糊的阴影效果，该效果投射在我的对象正下方的平面上（只是为了给它更多的深度）。光源 (DirectionalLight) 共享对象的中心坐标，但在 Y 轴上有偏移，因此它在正上方。它指向对象的中心。

我对灯光的阴影参数进行了一些实验，发现降低阴影贴图尺寸会给我带来相当不错的柔和阴影效果，这对我来说已经足够了。例如：

light.shadow.mapSize.width = 32;
light.shadow.mapSize.height = 32;

然而，我注意到阴影有一个偏移量，这让观察者假设光源不是直接来自上方：

我创建了这个小提琴，从中创建了图像。作为阴影类型，我使用 PCFSoftShadowMap。

有了这个设置，我会假设阴影效果在立方体的所有四个面上都是一样的，但显然不是。我还注意到，当增加阴影贴图尺寸时，这种“偏移”会变小，而在使用 512 或 1024 等尺寸时几乎不会被注意到。

这种方法将是达到预期效果的简单且高效的解决方案，因此我非常感谢您对此的任何帮助

编辑：

正如评论中所述，调整 LightShadow 的半径并不是一个令人满意的解决方案，因为阴影渐变具有硬边缘而不是软边缘。

标签： three.jsshadow

我认为正在发生的事情是您的阴影贴图的分辨率足够低，以至于您看到了舍入错误。如果你切换回THREE.BasicShadowMap，我想你会看到被击中的物理光照贴图像素恰好位于你看到较大边缘的对象一侧，并且随着你移动对象，阴影会移动在地图上的像素大小的步骤。

通常在实践中，您希望使用更高分辨率的光照贴图，并使其覆盖区域尽可能靠近场景的焦点，以便从光照贴图中获得最高分辨率。然后您可以调整 LightShadow 的 .radius 以获得正确的柔和度。