three.js - 不透明对象上的 Three.js 透明度伪影

Question

透明度伪影问题

您好，我对three.js 有疑问。我在我的场景中导入了一个不透明的“大”glb 模型，但如果模型在相机视图中被自身覆盖，则前景变得透明。（正如你在图片上看到的，背景山在前景）

我尝试了一些解决方案，例如：

• 在 glb 材料上的 depthTest 为 false
• 排序顺序为假
• 使用对数深度缓冲区
• 将材质透明更改为假
• 将 alphaTest 从 0 更改为 1 0.1 步

但没有任何效果。如果有人有解决方案:)

谢谢 ！

标签： three.jsoverlaytransparentdepth

Answer 1

无法完全正确地渲染透明对象。您首先需要渲染任何不透明的对象，然后从后到前渲染透明表面，以便任何新的表面混合在它后面的东西之上。在许多情况下，这是无法做到的，尤其是在渲染可能重叠的透明对象时。

解决这个问题需要将有问题的对象（甚至是单个三角形）切割成更小的部分，以便保留顺序，而这通常几乎是不可能的。由于您使用的是 Three.js，因此请查看是否可以更改您的设计以使这不是问题，或者不正确的渲染顺序的工件不会太明显。