【问题标题】:Why aren't shadows showing up?为什么没有影子出现?
【发布时间】:2015-05-18 20:46:36
【问题描述】:

我在 Three.js 中有一个非常标准的场景。有一些物体、一个地平面和一些定向灯,其中一个会投射阴影。我的大多数物体都会毫无问题地投射阴影。一些,出于某种原因,不这样做。所有Mesh 对象都嵌入在Object3D 对象的层次结构中,其中大多数对象的深度为2 或3 级。那些不投射阴影的层次结构更复杂,其中一些Mesh 对象的深度为 20 多个级别。层次结构是为了模仿在我试图移植的模拟程序中发现的复杂层次结构。

这是问题的截图:

这里只启用了阴影投射灯:

黄衫男和背景中的橙色机器人都有这个问题。他们都有复杂的层次结构。没有一个静止的物体有这个问题。它们具有更简单的 3 级层次结构。正如你所看到的,这个人被夹在几个可以正确投射阴影的物体之间,所以他肯定在光的阴影截锥体内。

我遵循了调试阴影的标准清单,但没有运气:

  • 定向光已将.castShadow 设置为true
  • 只有一个定向光投射阴影
  • 定向光的阴影截头体设置正确(您可以从屏幕截图中看到)
  • 场景中的每个Mesh 对象都将.castShadow.receiveShadow 设置为true
  • 地平面已将.receiveShadow 设置为true
  • 地平面上没有孔
  • 编辑:当我禁用除了投射阴影的所有灯时,问题仍然存在

深层层次结构是否与.castShadow 设置相混淆?这是我能想到的唯一解释。

编辑:这是来自定向光的深度缓冲区数据。请注意,没有任何东西看起来像我们的人或我们的机器人:

顺便说一句,我正在运行 Three.js r70。

【问题讨论】:

  • 尽管最初声明为Directional,但其他非阴影投射灯是否有可能充当Ambient Lights? @贾斯汀
  • 我不太清楚你的意思。但是,当我关闭每个灯时,问题仍然存在,除了投射阴影的灯。
  • 环境光被定义为一种均匀的光源,它向场景投射/或不投射阴影。正如您在此处看到的那样,en.wikipedia.org/wiki/Shading#Ambient_lighting。对于您的描述,在我看来,未投射阴影的灯光被视为环境灯光。顺便说一句,您能否提供将灯光添加到场景中的代码部分? @贾斯汀
  • 代码如下:this.scene.add(_obj.object); this.scene 是 THREE.Scene,_obj.object 是 THREE.DirectionalLight。这段代码隐藏在一两层抽象之下,所以我不确定这一行是否对调试有很大帮助。
  • 那么,您多次使用相同的函数和相同的变量来添加灯光,对吧?只有第一个有效,对吗?如果您尝试使用数组(例如)来避免将属性实例化到同一个对象,该怎么办?是否有意义? @贾斯汀

标签: javascript three.js


【解决方案1】:

由于您的层次结构有 20 层深,您需要遍历网格才能在所有层级上设置 .castShadow.receiveShadow

object.travese( function( child )
{
    if( child instanceof THREE.Object3D )
    {
        child.castShadow = true;
        child.receiveShadow = true;
    }
} );

【讨论】:

  • 因为 THREE.Mesh 继承自 THREE.Object3Dinstanceof 检查更改为 THREE.Mesh
  • 我在加载场景时已经这样做了。即使我运行这个.traverse 命令,它也不会改变缺少阴影的情况。
  • 我认为您需要发布有问题的模型之一。
【解决方案2】:

想通了。

在超深层次结构中的某处,我不小心将占位符Object3D 对象之一的.visible 属性设置为undefined。这表明 WebGLRenderer 和 ShadowMapPlugin 处理可见性的方式不同,因为它们出现在常规渲染中,而不是光的阴影相机渲染器中。会不会是bug?

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-11-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多