Cesium原理篇：glTF

关键字：Cesium glTF WebGL技术

大纲：

1 glTF简介，这是一个什么东西，有哪些特点

2 Cesium如何加载，渲染glTF，逻辑结构和关键技术

3 个人总结，从glTF学习如何设计一个二进制格式，个人想法分享

共计 4000字 | 建议阅读时间 未知

1 glTF简介

       之前介绍了Cesium的Property，Material，Batch，GroundPrimitive这些内容，可以说是简单地物和风格的解决思路。当Cesium把这些技术点整合起来，我们便具备了渲染模型的威力。也就是今天要讲的glTF模型渲染。

       glTF的全称是GL传输格式，是一种针对GL(WebGL，OpenGL ES以及OpenGL)接口的运行时资产(asset)。在3D内容的传输和加载中，glTF通过提供一种高效，易扩展，可协作的格式，填补了3D建模工具和现代GL应用之间的空白。github上有对该数据规范的详细介绍，春节期间我翻译了其中的核心部分，有兴趣的可以了解。

      三维模型的格式这么多，为什么不用现成了，而是非要自己重新定义一个规范，原文中Patrick很诚实详尽的做了解释。简单说，目前主流的三维模型主要的特点在于数据制作上，在Web传输和解析上无法满足需求，而glTF的特点就是传输和解析的高效。首先，二进制的传输方式最为高效，也就是ArrayBuffer形式，但二进制的解析则很繁琐，也很容易出错。如何提高解析效率呢，就如同云盘的秒传功能，不解析，或减少解析是最有效的解析方式， 要做到这一点，则要求显卡，WebGL能够直接加载该数据结构。

       上图是glTF的一个大概结构，分为四大块，最上面的json是一个表述，描述该模型的节点层级，材质，相机，动画等相关逻辑结构，bin则对应这些对象的具体数据信息，glsl是对该模型渲染的着色器，针对该模型的数据信息，给出渲染“配方”，当然还有纹理内容。大块内容可以以Base64的编码内迁到文件中，方便拷贝和加载，也可以以URI的外链方式，侧重重用性。

       下图是json中包含的描述信息，内容详细，比如mesh，纹理，蒙皮和动画，定义了accessor的访问器规则，同时还给出了相机，节点这些场景管理的信息。充分体现了glTF规范设计的强大，让我想到了一句话：“解决问题固然重要，但通过设计避免问题则更胜一筹”。可以说，该规范是对复杂三维模型的一个很不错的抽象，考虑的很充分，之间的接口定义也很规范，如果你也想设计一个二进制数据规范的话，这是一个很好的学习，借鉴范本。

2 glTF渲染

       东西再好，光说不练假把式。设计好了࿰