ThreeJS 阴影在墙壁附近表现得很有趣答案

【问题标题】：ThreeJS shadows acting funny near wallsThreeJS 阴影在墙壁附近表现得很有趣
【发布时间】：2016-10-05 19:51:57
【问题描述】：

所以我在 ThreeJS 中处理阴影。我正在使用带有 WebGLRenderer 的透视相机。照明设置是这样的。

var light = new THREE.SpotLight(0xdddddd, 1);
light.castShadow = true;
light.shadow = new THREE.LightShadow(new THREE.PerspectiveCamera(60, 1, 1, 2500));
light.shadow.bias = 0.0001;
light.shadow.mapSize.width = 1024;
light.shadow.mapSize.height = 1024;
light.position.set(100, 800, 0);

当我靠近墙壁时，我得到的是一个被切断的阴影。我玩过Shadow Bias，但对我来说这完全是在黑暗中刺伤。

我得到的是这种奇怪的阴影行为。我附上了一个屏幕截图，并用红色圈出了它，并带有一个指向它的箭头。注意阴影是如何被切断的，就好像光线从墙上反射并抵消了阴影一样。有什么办法可以避免吗？

【问题讨论】：

阴影相机截锥体似乎变窄了，使用shadow camera helper 对其进行检查，然后尝试将其从60 增加到90。
我认为您是对的，因为我确实按照您指出的那样设置了示例。我只是不确定如何将其设置为 90。
light.shadow = new THREE.LightShadow(new THREE.PerspectiveCamera(90, 1, 1, 2500));
我最终想通了。谢谢。我的灯关了 45 度，太近了。使用助手我调整了它，一切都很好。写下来，我会给你答案。

标签： 3d three.js shadows

【解决方案1】：

很可能阴影相机的frustm变窄了。你可以通过shadow camera helper查看：

var helper = new THREE.CameraHelper( light.shadow.camera );
scene.add( helper );

阴影相机的尺寸受限于性能，但您可以调整其中的每个平面以满足您的需要，或者只是增加它的角度（例如从 60 到 90）：

light.shadow = new THREE.LightShadow(new THREE.PerspectiveCamera(90, 1, 1, 2500));

【讨论】：