javascript - 云上的丑陋渲染

Question

我正在尝试实现 this tutorial 中的代码，但比例更大(半径 = 100000 个单位)。

我不知道大小是否重要，但在我的地球上渲染云有一个奇怪的渲染。正如教程所做的那样，我使用了两个球体和三个纹理(地球贴图、凹凸贴图、云)。

这是结果(如果云离得更近，情况会更糟):

云离行星表面越近，这种故障就越明显。如果云足够远(但这不现实)，问题就会完全消失。

我能做什么？

Answer 1

使用对数深度缓冲区而不是线性深度缓冲区。这是一个非常简单的更改，只需在创建 THREE.WebGLRenderer 时启用 logarithmicDepthBuffer，如下所示:

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

这里有一个例子，你可以看看: http://threejs.org/examples/#webgl_camera_logarithmicdepthbuffer

按照 LJ_1102 的建议使用 polygonOffset 是一种可能，但不是必需的。