THREE.JS:以正确的 z 索引渲染大的、远处的物体,并仍然放大小物体

标签 three.js physics zbuffer

我有一个场景,我正在绘制(按比例)地球、月球和一些航天器。当月球被地球遮挡时,它并没有消失,而是仍然可见(透过地球)。

来 self 的research我发现部分问题在于我的相机的近距设置太小,如链接的文章中详细介绍的,近距值过小会导致 z 排序中的舍入,从而混淆了非常远的物体。

这里的复杂性在于,当相机放大时,我需要有细粒度的 z 索引,以查看航天器(与地球相比,半径最大为 61 米的物体,重量为在r =~ 6.5e+06 米)。为了使月球和地球尺度上的物体以正确的顺序渲染,近距离必须至少为 100,000 m,此时我无法看到近距离物体。

一种解决方案是缩小比例以使用公里,但我不能失去这种精度,并且更喜欢使用米。

关于如何使非常大的、遥远的物体以正确的 z 索引渲染,同时保持比例和放大小物体的能力,有什么想法吗?

我的想法(我不知道如何实现):

  • 更改 z 缓冲区以包含更多值和更高的分辨率?
  • 将远处的物体添加到使用“farCamera”渲染的“farScene”中,该“farCamera”由特写相机上使用的相同控件控制?

最佳答案

根据 @WestLangley 的回答,解决方案只需将选项logarithmicDepthBuffer: true 添加到渲染器:

this.renderer = new THREE.WebGLRenderer({antialias: true, logarithmicDepthBuffer: true});

关于THREE.JS:以正确的 z 索引渲染大的、远处的物体,并仍然放大小物体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31122775/

相关文章:

c++ - 如何在 C++ 中处理一个非常大的二维数组

webgl - 位移贴图 UV 贴图?

Java - 突破物理学?

python - 求数值积分的根

c++ - Z-Buffer 的高效实现

3d - 在 3ds max 中以 16 位分辨率获取 z-Buffer

three.js - 如何用三个js绘制一个沿x轴的圆柱体?

javascript - Three.js - 在运行时更改 Material

javascript - Three.js 初学者卡在第一步 : "undefined is not a function"

时间校正 Verlet 积分和太大的时间步长