有Z战问题

Question

我正在使用Babylon.js制作3D游戏。我的项目旨在在所有浏览器上运行。但是，当用户在Firefox中运行它时，似乎存在一些Z战斗问题，其中某些3d对象将无法正确渲染或根本无法渲染！我还注意到某些纹理会像这样对角地延伸条纹接缝...

我在网上做了一些研究，发现了[[.css的z-index属性。我试过此设置，但它并不能解决我的问题。我愿意提出任何建议来帮助我解决此问题？提前非常感谢！

Answer 1

[看到我的评论被证明是有用的，我将在这里重新引用它，以允许将此答案标记为已接受。

大胆猜测，锐利边缘与抗锯齿有关，而3D相对较新。尝试更改任何透视图值。

Answer 2

这也可能是2天前与here相关的firefox错误。当您设置antialias:false时，Firefox也需要stencil:true来启用24位深度缓冲区。

Answer 3

z-fighting（in 2020）

BABYLON.js自2015年以来不断发展，因此，这是我对如何对抗Z战的建议：

1. material.useLogarithmicDepth = true;适用于您场景中的所有物料。看到这个how to。
2. 调整material.zOffset（负值强制向相机方向移动深度）。看到这个playground。

请注意，问题中的z-index和

css通常对3D场景没有影响。它生活在<canvas>元素内部的自己的世界中。 3D对象不是DOM元素，每个引擎（BABYLON，THREE等）都以自己的方式表示它们。