Thee.js 中 BufferGeometry 的渲染顺序

Question

在 previous question 之后，我正在处理 BufferGeometry 中的构建模型，并意识到 transparent 标志会影响渲染顺序：具有透明材质的对象将在非透明材质之后渲染.

此外，我从这篇文章中读到 thread, did an experiment on JSFiddle 并意识到 BufferGeometry 中面的渲染顺序与它们在缓冲区中指定的顺序相同，但与相机的距离不同。（在上面的实验中，我在缓冲区中先指定了一个更近的三角形，它遮挡了后面的其他人。）

所以我的问题是：是否可以在 BufferGeometry 中手动设置面的渲染顺序？就我而言，我可能需要动态更改构建元素的透明度。（我读过 thread 说我们可以设置 Object3D 的 renderOrder。）

谢谢。

Answer 1

人脸按照它们在 BufferGeometry 中出现的顺序呈现。

如果您必须动态改变场景元素的透明度，我建议您维护单独的几何图形，每个几何图形都与自己的 material.

配对

渲染器将首先渲染具有transparent = false的对象。然后它将渲染具有 transparent = true.

的对象

如果您对透明 materials 使用以下设置，您可能会发现伪影更少：

material.transparent = true;
material.opacity = 0.5; // or as desired
material.depthTest = true; // the default
material.depthWrite = false; // use for transparent materials only

此外，自我透明化尤其棘手。一个例子是半透明的立方体（或建筑物）。在这种情况下减少伪像的一种方法是渲染对象两次：第一次使用 material.side = THREE.BackSide，然后再次使用 material.side = THREE.FrontSide。您可以使用 object.renderOrder 在对象之间强制执行特定的渲染顺序。

three.js r.75

Thee.js 中 BufferGeometry 的渲染顺序

Render Order of BufferGeometry in Thee.js

javascript

three.js

buffer-geometry