时间戳

首页 > 解决方案 > ThreeJS MeshDepthMaterial 阴影不适用于动画

javascript - ThreeJS MeshDepthMaterial 阴影不适用于动画

问题描述

为了通过我的网格的透明部分投射阴影，我使用了，MeshDepthMaterial但是当我这样做时，我的对象的动画部分的阴影会随着动画停止移动。

您可以在这里查看示例：https ://jsfiddle.net/miger/kj8gwue5/

var customDepthMaterial = new THREE.MeshDepthMaterial( {
    depthPacking: THREE.RGBADepthPacking,
    alphaMap: alphaTex,
    alphaTest: 0.5
})
    
child.customDepthMaterial = customDepthMaterial;

如果您注释掉customDepthMaterial-input，您可以看到阴影通常会与动画一起出现，如此处的示例所示。但是，正如您所见，阴影不再投射到我的网格的透明部分，这不是我想要的效果。

我怎样才能解决这个问题？用 更新深度材料needsUpdate，没有做任何事情..

使用深度材质时，甚至可以使阴影与动画一起正常工作吗？

标签： javascriptthree.js

解决方案

添加skinning: true到您的深度材料：

var customDepthMaterial = new THREE.MeshDepthMaterial( {
    depthPacking: THREE.RGBADepthPacking,
    alphaMap: alphaTex,
    alphaTest: 0.5,
    skinning: true // add this property
})

推荐阅读