自透明对象从一侧看起来是正确的

Question

我正在使用THGL.js和WebGL渲染器，我有一个自我透明的对象。它是具有纹理和transparent: true的基本材质的单个几何体的网格。它从一侧看起来正确，其中透明部分正确地分层，但不是从另一侧：

左边的树看起来不对（忽略它们后面的地图），而右边的树很好（可以看到它们后面的地图）。你看到的整个东西都是单一的几何形状。

任何想法如何解决这个问题？

我目前正在使用kludge解决方案，使每个透明面都成为自己的对象，但这并不理想。

Answer 1

我曾遇到同样的问题。

这是一个很好的视频，让您了解为什么会发生这种情况：

Udacity Classroom Course

查看renderer.sortObjects和object.Model.material.depthWrite，它们可以帮助您，但很难100％正确地修复它。它会花费大量的GPU，你可以将你的代码上传到Codepen，pastebin，dropbox或任何东西（只有必要的东西），所以我可以尝试为你修复它。

修改 也许首先尝试将所有透明网格设置为：

object.Model.material.depthWrite = false;

<强> EDIT2： 只需在透明对象上尝试depthWrite = false即可。