双面平面上的阴影伪影 [英] Shadow artifacts on double sided plane

问题描述

当我在双面平面上投射一盏灯时，我看到了一个有问题的工件.有谁知道它为什么在那里，我应该怎么做才能避免这个问题?提前致谢！

When I cast a light on a double sided plane, I see a glitchy artifact. Does anyone know why it is there and what I should do to avoid this problem? Thanks in advance!

我检查过是否可以在其他任何地方找到此问题，但令人惊讶的是我找不到.

I checked if I could find this problem anywhere else, but surprisingly I could not.

/** 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/.我尝试只输入与此问题相关的代码.

Here is my code: http://jsfiddle.net/scjcvx3k/2/. I tried to put in only the code that was relevant for this question.

推荐答案

您正在从自阴影中获得工件.你有两个选择.一种是设置

You are getting artifacts from self-shadowing. You have two options. One is to set

plane.receiveShadow = false;

另一个是设置light.shadowBias.

light.shadowBias = -0.001;

不幸的是，设置 shadowBias 可能会导致另一个工件:Peter Panning".

Unfortunately, setting shadowBias can result in another artifact: "Peter Panning".

如果您想了解有关问题的更多信息，请搜索这些主题.

Google these topics if you want to know more about the issues.

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

三.js 71

这篇关于双面平面上的阴影伪影的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！