VAO
VAO(Vertext Array Object),中文是顶点数组对象。之前在《Buffer》一文中,我们介绍了Cesium如何创建VBO的过程,而VAO可以简单的认为是基于VBO的一个封装,为顶点属性数组和VBO中的顶点数据之间建立了关联。我们来看一下使用示例:
如同,创建顶点数据和顶点索引的部分之前已经讲过,然后将顶点数据添加到属性数组中,并最终构建成VAO,使用方式很简单。
RenderState
指定DrawCommand的渲染状态,比如剔除,多边形偏移,深度检测等,通过RenderState统一管理:
Drawcommand
前面我们讲了VBO/VAO,Texture,Shader以及FBO,终于万事俱备只欠东风了,当我们一切准备就绪,剩下的就是一个字:干。Cesium中提供了三类Command:DrawCommand、ClearCommand以及ComputeCommand。我们先详细的讲DrawCommand,同时也是最常用的。
如上是DrawCommand的创建方式,这里只有两个新的知识点,一个是owner属性,记录该DrawCommand是谁的菜,另外一个是pass属性。这是渲染队列的优先级控制。目前,Pass的枚举如下,具体内容下面后涉及:
创建完的DrawCommand会通过update函数,加载到frameState的commandlist队列中,比如Primitive中update加载drawcommand的伪代码:
进入队列后就开始听从安排,随时准备上前线(渲染)。Scene会先对所有的commandlist会排序,Pass值越小优先渲染,通过Pass的枚举可以看到最后渲染的是透明的和overlay:
根据渲染优先级排序后,会先渲染环境相关的command,比如skybox,大气层等,接着,开始渲染其他command:
接着,就是对每一个DrawCommand的渲染,也就是把之前VAO,Texture等等渲染到FBO的过程,这一块Cesium也封装的比较好,有兴趣的可以看详细代码,这里只讲一个逻辑,太困了。。。
ClearCommand
ClearCommand用于清空缓冲区的内容,包括颜色,深度和模板。用户在创建的时候,指定清空的颜色值等属性:
然后在渲染中更新队列执行清空指令:
然后,会根据你设置的颜色,深度,模板值来清空对应的帧缓冲区,代码好多啊,但很容易理解:
ComputeCommand
ComputeCommand需要配合ComputeEngine一起使用,可以认为是一个特殊的DrawCommand,它不是为了渲染,而是通过渲染机制,实现GPU的计算,通过Shader计算结果保存到纹理传出的一个过程,实现在Web前端高效的处理大量的数值计算,下面,我们通过学习之前ImageryLayer中对墨卡托影像切片动态投影的过程来了解该过程。
首先,创建一个ComputeCommand,定义这个计算过程前需要准备的内容,以及计算后对计算结果如何处理:
还记得Pass中的Compute枚举吧,放在第一位,每次Scene.update时,发现有ComputeCommand都会优先计算,这个逻辑和DrawCommand一样,都会在update中push到commandlist中,比如在ImageryLayer中,则是在
queueReprojectionCommands方法完成的,而具体的执行也和DrawCommand比较相似,稍微有一些特殊和针对的部分,具体代码如下:
Renderer系列告一段落,并没有涉及很多WebGL的语法层面,主要希望大家能对各个模块的作用有一个了解,并在这个了解的基础上,学习一下Cesium对WebGL渲染引擎的封装技巧。通过这一系列,个人很佩服Cesium的开发人员对OpenGL渲染引擎的理解,在完成这一系列的过程中,个人受益匪浅,也希望能对各位起到一个分享和帮助。
基于功能的面向函数的接口,封装成基于状态管理的面向对象的封装,方便了我们的使用和管理。但从中我们还是可以看到,WebGL在某些方面的薄弱,比如实例化和FBO的部分功能需要在WebGL2.0的规范下才支持,当然对此,我表示乐观,我感受到了WebGL标准化的快速发展。
另外,我也想到了用Three.js封装Cesium渲染引擎的可能,当然我对Three.js不了解,但随着不断学习Cesium。Renderer,我个人并不喜欢这个想法。我觉得在设计和封装上,Renderer已经很不错了,我们可以借鉴Three.js在功能和易用性上的特点,强化Cesium,而不是全盘否定重新造轮子。而且并不能因为点上的优势而进行面上的推倒,如果对这两个引擎都不了解,最好还是埋头学习少一点高谈阔论。基本功是顿悟不出来的。
转自:https://www.cnblogs.com/yanan-boke/p/9140519.html
Original: https://www.cnblogs.com/mazhenyu/p/16351147.html
Author: 3D入魔
Title: CESIUM 原理 之 COMMAND拼接【转】
原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/552666/
转载文章受原作者版权保护。转载请注明原作者出处!