Javascript 阴影贴图出现在错误的位置

我试图利用three.js中内置的阴影贴图插件。在最初的困难之后，我有了或多或少可以接受的图像，还有最后一个小故障。这一个是阴影出现在一些（所有？）曲面的顶部，法线为0,0,1。下面是同一型号的照片

3.js

Preview.app（Mac）

以及用于设置阴影的代码：

    var shadowLight = new THREE.DirectionalLight(0xFFFFFF);
    shadowLight.position.x = cx + dmax/2;
    shadowLight.position.y = cy - dmax/2;
    shadowLight.position.z = dmax*1.5;
    shadowLight.lookAt(new THREE.Vector3(cx, cy, 0));
    shadowLight.target.position.set(cx, cy, 0);
    shadowLight.castShadow = true;
    shadowLight.onlyShadow = true;
    shadowLight.shadowCameraNear    =  dmax;
    shadowLight.shadowCameraFar     =  dmax*2;
    shadowLight.shadowCameraLeft    = -dmax/2;
    shadowLight.shadowCameraRight   =  dmax/2;
    shadowLight.shadowCameraBottom  = -dmax/2;
    shadowLight.shadowCameraTop     =  dmax/2;
    shadowLight.shadowBias          =  0.005;
    shadowLight.shadowDarkness      =  0.3;
    shadowLight.shadowMapWidth      =  2048;
    shadowLight.shadowMapHeight     =  2048;
    // shadowLight.shadowCameraVisible = true;
    scene.add(shadowLight);

---

更新：这里有一个实例：

您的代码看起来不错。您只需要使用

shadowLight.shadowBias

参数。这总是有点棘手。（请注意，偏差参数可以为负值。）

编辑：收紧阴影摄影机的近平面和远平面。这将有助于减少暗影痤疮和彼得平移。例如，您的实时链接，设置

shadowLight.shadowCameraNear=3*dmax。这对我有用

如果桌面还没有深度，你也可以尝试增加桌面的深度

您可以尝试设置
renderer.shadowMapCullFrontFaces=false
。这将剔除背面而不是正面。
你能提供一个真实（简单）的例子吗？我刚刚做了一个小演示，降低了阴影分辨率，因为场景包含一个模型和一个立方体进行比较。现在我该如何让它看起来漂亮呢？：）这是不可能的，痤疮以较低的绝对值消失，但随后开始出现在较大的物体上。我认为整个技术不适用于几何体大小变化很大的场景，比如有两个非常细节的对象和一些非常大而简单的对象。你认为呢？我认为阴影映射工件必须逐个处理。我不太确定你的假设。好的演示，顺便问一下，你能回答这个问题吗？不是真的。那个人工制品带着更高的偏差消失了，但彼得·潘宁却出现了。我仍在研究这个问题，我怀疑THREE.js中有buggy depthRGBA着色器。我不知道你所说的个案是什么意思。我试着设置多个灯光，紧密对抗阴影摄影机的平截头台，但没有任何帮助。我说的是逐案处理，因为问题往往是几何特定的。因此，我只能给你一些尝试的东西——我不能给你一个“解决方案”。请参见答案中的编辑。