CesiumJS 2022^ 原理[2] 渲染架构之三维物体 - 创建并执行指令

最新推荐文章于 2025-10-24 17:50:12 发布

原创

最新推荐文章于 2025-10-24 17:50:12 发布 · 980 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#计算机

本文深入探讨CesiumJS的渲染架构，重点讲解如何生成和执行指令，包括Primitive如何创建指令，Context如何执行WebGL底层代码，以及多段视锥体技术和指令对象的转移过程。同时，介绍了CesiumJS中的指令和通道概念，为理解三维物体的渲染提供关键信息。

Python微信订餐小程序课程视频

https://blog.youkuaiyun.com/m0_56069948/article/details/122285951

Python实战量化交易理财系统

https://blog.youkuaiyun.com/m0_56069948/article/details/122285941
目录* 回顾
+ 预备知识：指令
+ 预备知识：通道

回顾

书接上文，Scene.js 模块内的 render 函数会将控制权交给 WebGL，执行 CesiumJS 自己封装的指令对象，画出每一帧来。

模块内的 render 函数首先会更新一批状态信息，譬如帧状态、雾效、Uniform 值、通道状态、三维场景中的环境信息等，然后就开始更新并执行指令，调用的是 Scene 原型链上的 updateAndExecuteCommands 方法。

整个过程大致的调用链是这样的（function 关键字简写为 fn）：

[Module Scene.js]
- fn render()
  - Scene.prototype.updateAndExecuteCommands()
    - fn executeCommandsInViewport()
      - fn updateAndRenderPrimitives()
          [Module Primitive.js]
          - fn createCommands()
          - fn updateAndQueueCommands()
      - fn executeCommands()
     	- fn executeCommand()

本篇讲解的是从 Scene 原型链上的 updateAndExcuteCommands() 方法开始，期间 Scene 中的 Primitives 是如何创建指令，又最终如何被 WebGL 执行的。

这个过程涉及非常多细节代码，但是为了快速聚焦整个过程，本篇先介绍两个 CesiumJS 封装的概念：指令和通道。