双面飞机上的阴影瑕疵

Question

当我在双面飞机上投光时，我看到一个小故障的神器。有谁知道为什么它存在，我该怎么做才能避免这个问题？提前谢谢！

我检查过我是否能在其他任何地方找到这个问题，但令人惊讶的是我不能。

/** Plane that causes glitch. */
function addPlane(x, y, z, size) {
  var geometry = new THREE.PlaneGeometry( size, size, 1, 1 );
  var material = new THREE.MeshPhongMaterial({color: 0x0077aa, side: THREE.DoubleSide});
  var plane = new THREE.Mesh(geometry, material);
  plane.castShadow = true;
  plane.receiveShadow = true;
  plane.position.set(x, z, y);
  plane.rotateX(Math.PI * 1.5);
  scene.add(plane);
}

这是我的代码：http://jsfiddle.net/scjcvx3k/2/。我试图只输入与此问题相关的代码。

Answer 1

你正在从自我遮蔽中获取神器。你有两个选择。一个是设置

plane.receiveShadow = false;

另一种是设置light.shadowBias。

light.shadowBias = -0.001;

不幸的是，设置shadowBias会导致另一件神器：“Peter Panning”。

如果您想了解有关这些问题的更多信息，请参阅Google这些主题。

更新了小提琴：http://jsfiddle.net/scjcvx3k/7/

three.js 71