当前位置:首页 >教程首页 > 游戏设计 > 3D模型大师班 >《Trigger Rally》的WebGL地形渲染技巧(1)

《Trigger Rally》的WebGL地形渲染技巧(1)

发布时间:2018-11-17 19:57:24
  在本系列中,我将介绍WebGL游戏《Trigger Rally》中使用的地形渲染技术。 (第2部分

  一个难题

  在电脑图像和游戏中高效沉浸大面积、精细的地图是一个难题。

terrain3

  使用WebGL(网页图形库)却可以使这个难题变得容易。WebGL是浏览器的OpenGL(开放图形语言),允许用户使用GPU的性能,但有一些限制。更重要的是,在本地应用中用JavaScript处理CPU端的数据更慢。把数据转移到GPU,比在本地应用中要求更多的安全性检查,以保证网络用户安全。然而,一旦数据到GPU,绘制就非常快了。

gpu-good-cpu-bad

  最大化GPU工作和最小化CPU工作的好办法是,在启动时把静态数据(顶点、指数和纹理)载入到GPU,然后在运行时用尽量少的调用渲染它。

  但仅靠静态数据是很难做出漂亮的地形的,因为镜头通常会很接近地面,而在屏幕上看,最近处和最远处的地面之间的精细度差异会很明显。

  另外,在给定的GPU交互率下,能够绘制的三角形的数量是有限的。三角形数量的多少取决于应用或游戏运行的系统,但通常不可能在整个平面上大面积地、精细地渲染。

  因为三角形数量有限,我们必须找出最佳的三角形分配方案。所以,在接近镜头时我们以低细节均匀分布,因为于玩家不可能欣赏到更远处的细节。

terrain-diagram1

  注意,近处的视线(粉红部分)表面积比远处的视线(蓝色部分)的更大。理想情况下,我们会让接近镜头的地方比远离镜头的地方有更多三角形,以平均二者。

terrain-diagram2

  但对于移动的视点和纯静态的顶点数据,这个方法并不太管用。

terrain-diagram3

  如果你乐意做些CPU上的工作,那么你可以根据当前的视点,使用多种算法中的一种来调整地形的细节程度(LOD)。各个算法都以各自的方式平衡CPU的工作和GPU的工作。

  解决方案:Geoclipmapping

  我们如何用纯静态顶点数据达到可调节的LOD?Geoclipmapping和顶点纹理就是答案。

  我们不是编码顶点数据中的高度信息,而是把它留在单独的纹理里。这样,我们的顶点数据可以用中央更高的分辨率和从源头开始的递减的分辨率环编码简单的网格模型。

terrain-diagram4

  在运行时,我们把这个网格模型放在当前视点之下,然后从顶点着色器的高地纹理地图中取样本。

  事实上要做的事不止这些,所以在本系列的下一篇文章中,我将继续详细geoclipmapping的运作原理和执行方法。再之后,我将讨论多分辨率heightmapping和表面着色。
学员作品赏析
  • 2101期学员李思庭作品

    2101期学员李思庭作品

  • 2104期学员林雪茹作品

    2104期学员林雪茹作品

  • 2107期学员赵凌作品

    2107期学员赵凌作品

  • 2107期学员赵燃作品

    2107期学员赵燃作品

  • 2106期学员徐正浩作品

    2106期学员徐正浩作品

  • 2106期学员弓莉作品

    2106期学员弓莉作品

  • 2105期学员白羽新作品

    2105期学员白羽新作品

  • 2107期学员王佳蕊作品

    2107期学员王佳蕊作品

专业问题咨询

你担心的问题,火星帮你解答

微信扫码在线答疑

扫码领福利1V1在线答疑

点击咨询
添加老师微信,马上领取免费课程资源

1. 打开微信扫一扫,扫描左侧二维码

2. 添加老师微信,马上领取免费课程资源

×

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定