Cesium高阶学习二、Cesium渲染器

一、简介

我们都知道,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 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Cesium进阶学习

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值