Javascript 三条奇怪的条纹阴影

我正在努力使厨房里的房间变亮 您可以注意到厨房元素上阴影的水平方向

我怀疑聚光灯在x、y和z轴的中间。 如果我沿着y轴只移动光源1点（房间是500x300），我得到了整个地板上的阴影： 如果我移动灯光1或50，同样的问题也会发生

---

所有元素都会投射和接收阴影。

此问题通常是由于点附近的阴影太靠近对象造成的。 为了更好地理解，请尝试执行以下操作： 创建灯光后，可以添加摄影机辅助对象以显示灯光的边界

var spotLight = new THREE.SpotLight(0xffffff, 0.3, 0, Math.PI / 2);
spotLight.position.set(0, 100, 0);
sunLight.castShadow = true;

var shadowCameraHelper = new THREE.CameraHelper(spotLight.shadow.camera);
shadowCameraHelper.visible = true;

Kepp改变这两个价值观直到你达到目标

spotLight.shadow.camera.near = 50;
spotLight.shadow.camera.far = 150;

请记住，设置spotLight.shadow.camera.far越多，阴影越模糊

在本例中，您可以随时检查threejs

---

您可以将阴影偏移调整到一些较小的值，这有时会缓解这些问题

shadow.bias = 0.0001

---

你的楼层是怎么布置的？是一架大飞机还是多架小飞机？再看一眼你的场景。看起来确实有重叠的几何体。这意味着yopu在同一位置有多个平面。因此，渲染器不知道要渲染什么，从而导致这种行为。