Three.js WebGL渲染透明对象。维持秩序

这是我的测试应用程序inthree.js-

有两个立方体-绿色是上面的一个。如果取消选中“立方体2”（黄色内部立方体），它将不可见。当你们旋转相机，然后在旋转后检查“立方体2”，它变为外部。它并非以所有旋转角度进行复制

添加“renderer.sortObjects=false”修复了该问题。但是你能解释一下这种行为的原因吗？渲染器根据对象的位置对其进行排序。当某些对象是透明的时，为什么渲染顺序会更改？它的位置没有改变

这与什么有关

谢谢，

---

珍雅

您的演示中没有透明对象，只有不透明对象。您正在更改可见性

WebGLRenderer

根据对象与摄影机的距离对对象进行排序，并按排序顺序渲染对象。它从前面到后面渲染不透明对象

当两个对象与摄影机的距离相同时，由于排序算法如何断开连接，渲染顺序可能会发生变化

但是，关闭可见性然后再次打开时，渲染顺序不一定会更改。移动相机时，由于舍入，可能会改变到深度缓冲区的最低有效数字距离。因此，第二个对象有时渲染，有时不渲染

在完全相同的位置有两个大小和方向完全相同的立方体。不要那样做。它可能会导致各种渲染问题，其中最常见的是闪烁

---

three.js r.58

演示中没有透明对象，只有不透明对象。您正在更改可见性

WebGLRenderer

根据对象与摄影机的距离对对象进行排序，并按排序顺序渲染对象。它从前面到后面渲染不透明对象

当两个对象与摄影机的距离相同时，由于排序算法如何断开连接，渲染顺序可能会发生变化

但是，关闭可见性然后再次打开时，渲染顺序不一定会更改。移动相机时，由于舍入，可能会改变到深度缓冲区的最低有效数字距离。因此，第二个对象有时渲染，有时不渲染

在完全相同的位置有两个大小和方向完全相同的立方体。不要那样做。它可能会导致各种渲染问题，其中最常见的是闪烁

---

three.js r.58

演示中没有透明对象，只有不透明对象。在完全相同的位置有两个大小和方向完全相同的立方体。这绝不是一个好主意。你想达到什么目标？还可以看到：我希望在场景中显示对象的顺序相同，即使其中一些对象变得不可见，然后再次可见。在您提供的链接中，您写道“Weggle渲染器根据对象的位置对对象进行排序，并按排序顺序渲染对象”。但为什么在更改对象的可见性时会更改渲染顺序？它的位置还是一样的。演示中没有透明的对象，只有不透明的对象。在完全相同的位置有两个大小和方向完全相同的立方体。这绝不是一个好主意。你想达到什么目标？还可以看到：我希望在场景中显示对象的顺序相同，即使其中一些对象变得不可见，然后再次可见。在您提供的链接中，您写道“Weggle渲染器根据对象的位置对对象进行排序，并按排序顺序渲染对象”。但为什么在更改对象的可见性时会更改渲染顺序？它的位置还是一样的。