GLTF教程翻译

本教程介绍了GLTF，GL传输格式。它总结了GLTF最重要的特征和应用案例，并描述了与GLTF相关的文件的结构。它解释了如何读取，处理，并用于有效地显示GLTF assets中的3D图形。

另外需要了解JSON的一些基本知识，JavaScript对象表示法。此外，需要对常用图形API（如OpenGL或WebGL）的基本了解。本教程专注于GLTF 2.0版，其中介绍了对物理上基于渲染的支持，但此处解释的其他概念类似于它们在GLTF版本1.0中实现的方式。

1. 使用WebGL介绍GLTF

越来越多的应用程序和服务基于3D内容。网上商店提供带3D预览的产品配置器。博物馆用3D扫描将文物数字化，让游客探索虚拟画廊的集合。城市规划师使用3D城市模型进行规划和信息可视化。教育工作者创建人体的交互式动画3D模型。许多这些应用程序直接在Web浏览器中运行，这是可能的，因为所有现代浏览器都支持使用WebGL的高效渲染。

GLTF是3D场景传输格式的定义：

• 使用JSON描述了场景结构，这非常紧凑，可以轻松解析。
• 对象的3D数据以可由公共图形API直接使用的形式存储，因此没有用于解码或预处理3D数据的开销。
• GLTF可能有助于弥合内容创建和渲染之间的差距

2. GLTF的基本结构

2.1 GLTF核心

GLTF的核心是JSON文件，此文件描述了3D场景的整个内容。它由场景结构本身的描述组成，其由定义场景图的节点的层次提供。 场景中出现的3D对象是使用连接到节点的网格定义的。材料定义对象的外观。动画描述3D对象如何随着时间的推移转换3D对象（例如，旋转到转换），并且Skins定义了对物体的几何形状的方式基于骨架姿势变形。摄像机描述了渲染器的视图配置。

JSON结构

“meshes” :
[
{ … }
{ … }
…
],

场景对象 Mesh 存储在JSON文件中的数组中。可以使用数组中的相应对象的下标索引访问它们：

“nodes”:
[
{ “mesh”: 0, … },
{ “mesh”: 5, … },
…
}

这些 Nodes 也用于定义对象之间的关系。上面的示例定义了多个网格，并且节点可以使用网格索引指示这些网格中的一个，以指示网格应该附加到此节点：

以下图像（从GLTF概念部分调整）概述了GLTF资产的JSON部分的顶级元素：

以上元素概括描述如下：

• scene 是存储在GLTF中的场景描述的入口点。它指的是定义场景图的节点。
• node 是scene 图层次结构中的一个节点。它可以包含变换（例如，旋转或平移），并且它可以参考进一步（儿童）节点。另外，它可以指的是“连接”到节点的网状或相机实例camera，或者对描述网格变形的皮肤skin。
• camera 定义了呈现场景的视图配置。
• mesh 描述了一个出现在场景中的几何对象。它是指用于访问实际几何数据的访问器对象accessor，以及在渲染时定义对象外观的材料material。
• skin 定义了顶点皮肤所需的参数，这允许基于虚拟字符的姿势对网格的变形animation。这些参数的值是从访问器获得的。
• animation 描述某些节点的转换如何随时间变化的节点（例如，旋转或平移）。
• accessor 用作任意数据的抽象来源。它由网格mesh，皮肤skin和动画animation使用，并提供几何数据，皮肤参数和时间相关的动画值。它指的是bufferView缓冲器，是包含实际原始二进制数据的缓冲区buffer的一部分。
• materail 包含定义对象外观的参数。它通常是指将应用于渲染的几何体的纹理对象。
• texture 纹理由采样器和图像定义。采样器定义了如何将纹理图像放在对象上。

2.2 对外部数据的引用

二进制数据binary，如几何和3D对象的纹理texture，通常不包含在JSON文件中。相反，它们存储在专用文件中，json部分仅包含与这些文件的链接。这允许二进制数据以非常紧凑的形式存储，并且可以在网上有效地传输。另外，数据可以以可直接在渲染器中直接使用的格式存储，而无需解析，解码或预处理数据。

二进制数据只是从缓冲区的URI读取的原始内存块，没有固有的含义或结构。缓冲区buffer，缓冲器bufferView 和访问者accessor 部分将显示如何使用有关数据类型和数据布局的信息来扩展该原始数据。利用该信息，数据的一部分可以被解释为动画数据，另一部分可以被解释为几何数据。以二进制形式存储数据允许它比JSON格式更有效地将其传输到Web上，并且二进制数据可以直接传递给渲染器bufferView，而无需解码或预处理它。

参考

• https://github.com/KhronosGroup/glTF-Tutorials/blob/master/gltfTutorial/gltfTutorial_001_Introduction.md