本文翻譯自:github.com/fangcun010/g

由於本人才疏學淺,翻譯難免有誤,望各位不吝惜指正。


glTF資源格式支持頂點蒙皮,允許幾何數據基於骨骼數據進行變形。這使得場景中的3D對象可以變得更加真實。在glTF資源的JSON文件中可以通過定義skin對象來描述蒙皮信息。

下面給出了一個帶有簡單蒙皮信息的glTF資源的JSON文件。在本章節,我們會對這一JSON文件進行簡單地說明,有關頂點蒙皮的更多信息會在下一章節介紹。

{
"scenes" : [ {
"nodes" : [ 0 ]
} ],

"nodes" : [ {
"skin" : 0,
"mesh" : 0,
"children" : [ 1 ]
}, {
"children" : [ 2 ],
"translation" : [ 0.0, 1.0, 0.0 ]
}, {
"rotation" : [ 0.0, 0.0, 0.0, 1.0 ]
} ],

"meshes" : [ {
"primitives" : [ {
"attributes" : {
"POSITION" : 1,
"JOINTS_0" : 2,
"WEIGHTS_0" : 3
},
"indices" : 0
} ]
} ],

"skins" : [ {
"inverseBindMatrices" : 4,
"joints" : [ 1, 2 ]
} ],

"animations" : [ {
"channels" : [ {
"sampler" : 0,
"target" : {
"node" : 2,
"path" : "rotation"
}
} ],
"samplers" : [ {
"input" : 5,
"interpolation" : "LINEAR",
"output" : 6
} ]
} ],

"buffers" : [ {
"uri" : "data:application/gltf-buffer;base64,AA為了排版而省略,可以使用英文原文中的代碼",
"byteLength" : 168
}, {
"uri" : "data:application/gltf-buffer;base64,A//=為了排版而省略,可以使用英文原文中的代碼",
"byteLength" : 320
}, {
"uri" : "data:application/gltf-buffer;base64,AA=為了排版而省略,可以使用英文原文中的代碼",
"byteLength" : 128
}, {
"uri" : "data:application/gltf-buffer;base64,AA//為了排版而省略,可以使用英文原文中的代碼",
"byteLength" : 240
} ],

"bufferViews" : [ {
"buffer" : 0,
"byteOffset" : 0,
"byteLength" : 48,
"target" : 34963
}, {
"buffer" : 0,
"byteOffset" : 48,
"byteLength" : 120,
"target" : 34962
}, {
"buffer" : 1,
"byteOffset" : 0,
"byteLength" : 320,
"byteStride" : 16
}, {
"buffer" : 2,
"byteOffset" : 0,
"byteLength" : 128
}, {
"buffer" : 3,
"byteOffset" : 0,
"byteLength" : 240
} ],

"accessors" : [ {
"bufferView" : 0,
"byteOffset" : 0,
"componentType" : 5123,
"count" : 24,
"type" : "SCALAR",
"max" : [ 9 ],
"min" : [ 0 ]
}, {
"bufferView" : 1,
"byteOffset" : 0,
"componentType" : 5126,
"count" : 10,
"type" : "VEC3",
"max" : [ 1.0, 2.0, 0.0 ],
"min" : [ 0.0, 0.0, 0.0 ]
}, {
"bufferView" : 2,
"byteOffset" : 0,
"componentType" : 5123,
"count" : 10,
"type" : "VEC4",
"max" : [ 0, 1, 0, 0 ],
"min" : [ 0, 1, 0, 0 ]
}, {
"bufferView" : 2,
"byteOffset" : 160,
"componentType" : 5126,
"count" : 10,
"type" : "VEC4",
"max" : [ 1.0, 1.0, 0.0, 0.0 ],
"min" : [ 0.0, 0.0, 0.0, 0.0 ]
}, {
"bufferView" : 3,
"byteOffset" : 0,
"componentType" : 5126,
"count" : 2,
"type" : "MAT4",
"max" : [ 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, -0.5, -1.0, 0.0, 1.0 ],
"min" : [ 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, -0.5, -1.0, 0.0, 1.0 ]
}, {
"bufferView" : 4,
"byteOffset" : 0,
"componentType" : 5126,
"count" : 12,
"type" : "SCALAR",
"max" : [ 5.5 ],
"min" : [ 0.0 ]
}, {
"bufferView" : 4,
"byteOffset" : 48,
"componentType" : 5126,
"count" : 12,
"type" : "VEC4",
"max" : [ 0.0, 0.0, 0.707, 1.0 ],
"min" : [ 0.0, 0.0, -0.707, 0.707 ]
} ],

"asset" : {
"version" : "2.0"
}
}

上面代碼由渲染程序渲染的效果如下:

圖19a:簡單的蒙皮效果

簡單蒙皮示例中出現的場景元素

示例代碼中出現的場景元素匯總如下:

  • scenes數組對象和nodes數組對象已經在之前的章節介紹過。代碼中加入了索引為1和索引為2兩個新的node對象,用來定義骨骼。可以認為新添加的node對象是骨骼間的關節點,用於變形網格。
  • skins數組對象,我們會在下一章節解釋說明。
  • animations數組對象,之前的章節,我們已經做過介紹。animation對象引用了作為骨骼的node對象,用來產生蒙皮動畫。
  • meshs數組對象,之前的章節,我們已經做過介紹。在本示例,我們為mesh.primitive對象添加了"JOINTS_0"和"WEIGHT_0"屬性,用於頂點蒙皮。
  • buffers數組對象,bufferViews數組對象和accessors數組對象,之前的章節,我們已經做過介紹。在本示例,新添加的這類對象被我們用來描述頂點蒙皮信息。

下一章節,我們會介紹這些元素如何結合起來產生蒙皮動畫。


fangcun:glTF格式詳解(目錄)?

zhuanlan.zhihu.com
圖標

推薦閱讀:
相關文章