一、简介
我们都知道,Cesium是一个WebGL引擎,其绘图操作底层都是调用的WebGL绘图接口,Cesium将底层与WebGL交互的操作封装到了一个渲染模块,我们也可以称该模块为Cesium渲染器。
封装渲染器的好处:
重用性,将与WebGL交互的部分封装到一个模块,在Cesium其他地方都可以调用
移植性,减小WebGL更新带来的影响,
状态管理,Webgl是一个状态机,渲染器能够统一管理这些状态
性能,Cesium团队具有丰富的经验,封装的渲染器能够保证程序性能
Cesium渲染器源码位于packages/engine/Source/Renderer目录下:
Cesium的渲染器会涉及到很多WebGL的概念,如果您不熟悉WebGL相关的概念,可以先参考“WebGL编程指南”一书。下面就开始学习重要的对象:
1、Buffer 顶点缓冲对象,即常说的VBO,源码如下:
function Buffer(options) {
const gl = options.context._gl;
const bufferTarget = options.bufferTarget;
const typedArray = options.typedArray;
let sizeInBytes = options.sizeInBytes;
const usage = options.usage;
const hasArray = defined(typedArray);
if (hasArray) {
sizeInBytes = typedArray.byteLength;
}
const buffer = gl.createBuffer();
gl.bindBuffer(bufferTarget, buffer);
gl.bufferData(bufferTarget, hasArray ? typedArray : sizeInBytes, usage);
gl.bindBuffer(bufferTarget, null);
}
Buffer.createVertexBuffer = function (options) {
...
};
Buffer.createIndexBuffer = function (options) {
...
};
2、VertextArray 顶点数组对象,即常说的VAO,创建一个VAO,最常用的是VertexArray.fromGeometry()方法,而不是new VertexArray(),源码如下:
function VertexArray(options) {
...
this._numberOfVertices = numberOfVertices;
this._hasInstancedAttributes