參考資料：threejs中文網(wǎng)

threejs qq交流群：814702116

GLTF格式簡(jiǎn)介 (Web3D領(lǐng)域JPG)

本節(jié)課算是科普介紹，不用掌握具體的知識(shí)細(xì)節(jié)，大概有個(gè)印象即可。

gltf格式的重要性

GLTF格式是新2015發(fā)布的三維模型格式，隨著物聯(lián)網(wǎng)、WebGL、5G的進(jìn)一步發(fā)展，會(huì)有越來(lái)越多的互聯(lián)網(wǎng)項(xiàng)目Web端引入3D元素，你可以把GLTF格式的三維模型理解為.jpg、.png格式的圖片一樣，現(xiàn)在的網(wǎng)站，圖片基本是標(biāo)配，對(duì)于以后的網(wǎng)站來(lái)說(shuō)如果需要展示一個(gè)場(chǎng)景，使用3D來(lái)替換圖片表達(dá)也是很正常的事情。圖片有很多格式，對(duì)于三維模型自然也是如此，Web開發(fā)的時(shí)候圖片會(huì)有常用格式，對(duì)于Web3D開發(fā)也一樣，肯定會(huì)根據(jù)需要選擇一個(gè)常見的大家都熟悉的格式，隨時(shí)時(shí)間的發(fā)展，GLTF必然稱為一個(gè)極為重要的標(biāo)準(zhǔn)格式。

不僅three.js，其它的WebGL三維引擎cesium、babylonjs都對(duì)gltf格式有良好的的支持。

GLTF 2.0

Khronos Group組織2015發(fā)布了GLTF 1.0版本，在2017年又發(fā)布了GLTF2.0的版本。

關(guān)于glTF的更多介紹和信息，可以查看github：https://github.com/KhronosGroup/glTF

gltf包含內(nèi)容

相比較obj、stl等格式而言，.gltf格式可以包含更多的模型信息。

.gltf格式文件幾乎可以包含所有的三維模型相關(guān)信息的數(shù)據(jù)，比如模型層級(jí)關(guān)系、PBR材質(zhì)、紋理貼圖、骨骼動(dòng)畫、變形動(dòng)畫…

GLTF格式信息

如果你有一定的前端基礎(chǔ)，那么你對(duì)JSON一定不陌生，GLTF文件就是通過(guò)JSON的鍵值對(duì)方式來(lái)表示模型信息，比如meshes表示網(wǎng)格模型信息，materials表示材質(zhì)信息…

{
  "asset": {
    "version": "2.0",
  },
...
// 模型材質(zhì)信息
  "materials": [
    {
      "pbrMetallicRoughness": {//PBR材質(zhì)
        "baseColorFactor": [1,1,0,1],
        "metallicFactor": 0.5,//金屬度
        "roughnessFactor": 1//粗糙度
      }
    }
  ],
  // 網(wǎng)格模型數(shù)據(jù)
  "meshes": ...
  // 紋理貼圖
  "images": [
        {
            // uri指向外部圖像文件
            "uri": "貼圖名稱.png"http://圖像數(shù)據(jù)也可以直接存儲(chǔ)在.gltf文件中
        }
   ],
     "buffers": [
    // 一個(gè)buffer對(duì)應(yīng)一個(gè)二進(jìn)制數(shù)據(jù)塊，可能是頂點(diǎn)位置 、頂點(diǎn)索引等數(shù)據(jù)
    {
      "byteLength": 840,
     //這里面的頂點(diǎn)數(shù)據(jù)，也快成單獨(dú)以.bin文件的形式存在   
      "uri": "data:application/octet-stream;base64,AAAAPwAAAD8AAAA/AAAAPwAAAD8AAAC/.......
    }
  ],
}

.bin文件

有些glTF文件會(huì)關(guān)聯(lián)一個(gè)或多個(gè).bin文件，.bin文件以二進(jìn)制形式存儲(chǔ)了模型的頂點(diǎn)數(shù)據(jù)等信息。
.bin文件中的信息其實(shí)就是對(duì)應(yīng)gltf文件中的buffers屬性，buffers.bin中的模型數(shù)據(jù)，可以存儲(chǔ)在.gltf文件中,也可以單獨(dú)一個(gè)二進(jìn)制.bin文件。

"buffers": [
    {
        "byteLength": 102040,
        "uri": "文件名.bin"
    }
]

二進(jìn)制.glb

gltf格式文件不一定就是以擴(kuò)展名.gltf結(jié)尾，.glb就是gltf格式的二進(jìn)制文件。比如你可以把.gltf模型和貼圖信息全部合成得到一個(gè).glb文件中，.glb文件相對(duì).gltf文件體積更小，網(wǎng)絡(luò)傳輸自然更快。

導(dǎo)出gltf

blender：最新版本可以直接導(dǎo)出gltf。

3damx gltf相關(guān)插件：https://github.com/BabylonJS/Exporters/releases

Blender導(dǎo)入導(dǎo)出gltf模型文件

你可以用Blender軟件導(dǎo)出繪制好的三維模型，也可以打開和預(yù)覽gltf格式文件模型。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-819799.html

到了這里，關(guān)于threejs項(xiàng)目 ：GLTF格式簡(jiǎn)介 (Web3D領(lǐng)域JPG)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！