如何使用Open GL ES 2.0或WebGL创建雾？

Question

我想为我的游戏创建一个雾效果，但我找不到任何有关如何使用OpenGL ES 2.0的教程。如果任何人有链接教程，可以提供解释或源代码，我将不胜感激。

Answer 1

在OpenGL ES 2.0编程指南（第202页）中，有一节介绍使用着色器复制固定功能雾。源代码可在谷歌代码项目（MIT许可证）上找到。这是一个巨大的rendermonkey XML文件，但是the shader source embedded in it is pretty straightforward（我会直接在这里复制它，但不知道是否可以）。

这个想法是使用特定像素的距离作为雾函数的输入。在这个例子中，他们计算顶点着色器中的眼到顶点的距离，然后通过将其作为变量传递给每个片段来提供插值的距离。

然后他们做一个简单的线性雾功能。有一些最小距离，即零雾色和最大距离，其中输出全部是雾色。您可以通过像素距离落在最大值和最小值之间的位置混合（线性内插）雾颜色和碎片颜色。如书中提到的，一旦你有了这个工作，就没有理由限制自己的线性雾。您可以很容易地使其成为指数，取决于其他变量（例如到地面的距离，由于纹理查找或噪声函数而导致的变量），通过它使上帝的光线等。

从您的问题中不清楚你究竟是什么因为如果你想要真正充满活力，那就是另一场球赛（并不总是值得你获得效果的开发工作和性能成本）。对于现有的WebGL代码，您可能会尝试类似Three Dreams of Black的加载屏幕，您可以在source code中找到某处，或者您可以更多地使用基于模拟的实际modeling the fog as a 3d fluid。