50. GLTF格式简介 (Web3D领域JPG)
gltf格式的重要性
GLTF格式是新2015发布的三维模型格式，随着物联网、WebGL、5G的进一步发展，会有越来越多的互联网项目Web端引入3D元素，你可以把GLTF格式的三维模型理解为.jpg、.png格式的图片一样，现在的网站，图片基本是标配，对于以后的网站来说如果需要展示一个场景，使用3D来替换图片表达也是很正常的事情。图片有很多格式，对于三维模型自然也是如此，Web开发的时候图片会有常用格式，对于Web3D开发也一样，肯定会根据需要选择一个常见的大家都熟悉的格式，随时时间的发展，GLTF必然称为一个极为重要的标准格式。
不仅three.js，其它的WebGL三维引擎cesium、babylonjs都对gltf格式有良好的的支持。
GLTF 2.0
Khronos Group组织2015发布了GLTF 1.0版本，在2017年又发布了GLTF2.0的版本。
关于glTF的更多介绍和信息，可以查看github：https://github.com/KhronosGroup/glTF(opens new window)
gltf包含内容
相比较obj、stl等格式而言，.gltf格式可以包含更多的模型信息。
.gltf格式文件几乎可以包含所有的三维模型相关信息的数据，比如模型层级关系、PBR材质、纹理贴图、骨骼动画、变形动画...
GLTF格式信息
如果你有一定的前端基础，那么你对JSON一定不陌生，GLTF文件就是通过JSON的键值对方式来表示模型信息，比如meshes表示网格模型信息，materials表示材质信息...
{
"asset": {
"version": "2.0",
},
...
// 模型材质信息
"materials": [
{
"pbrMetallicRoughness": {//PBR材质
"baseColorFactor": [1,1,0,1],
"metallicFactor": 0.5,//金属度
"roughnessFactor": 1//粗糙度
}
}
],
// 网格模型数据
"meshes": ...
// 纹理贴图
"images": [
{
// uri指向外部图像文件
"uri": "贴图名称.png"//图像数据也可以直接存储在.gltf文件中
}
],
"buffers": [
// 一个buffer对应一个二进制数据块，可能是顶点位置 、顶点索引等数据
{
"byteLength": 840,
//这里面的顶点数据，也快成单独以.bin文件的形式存在
"uri": "data:application/octet-stream;base64,AAAAPwAAAD8AAAA/AAAAPwAAAD8AAAC/.......
}
],
}
.bin文件
有些glTF文件会关联一个或多个.bin文件，.bin文件以二进制形式存储了模型的顶点数据等信息。 .bin文件中的信息其实就是对应gltf文件中的buffers属性，buffers.bin中的模型数据，可以存储在.gltf文件中,也可以单独一个二进制.bin文件。
"buffers": [
{
"byteLength": 102040,
"uri": "文件名.bin"
}
]
二进制.glb
gltf格式文件不一定就是以扩展名.gltf结尾，.glb就是gltf格式的二进制文件。比如你可以把.gltf模型和贴图信息全部合成得到一个.glb文件中，.glb文件相对.gltf文件体积更小，网络传输自然更快。
导出gltf
blender：最新版本可以直接导出gltf。
3damx gltf相关插件：https://github.com/BabylonJS/Exporters/releases
Blender导入导出gltf模型文件
你可以用Blender软件导出绘制好的三维模型，也可以打开和预览gltf格式文件模型。