下面的文件是在最小gltf文件基础上增加了动画，表示的是上图所示的一个旋转的三角形，针对动画部分添加了注释

{ "scene": 0, "scenes" : [ { "nodes" : [ 0 ] } ], "nodes" : [ { "mesh" : 0, // rotation属性是使用4元数表示的旋转,[0,0,0,1]表示旋转角度为0°，即没有任何旋转，这里不对四元数做相关说明，后续文章再单独介绍 "rotation" : [ 0.0, 0.0, 0.0, 1.0 ] } ], "meshes" : [ { "primitives" : [ { "attributes" : { "POSITION" : 1 }, "indices" : 0 } ] } ], //该属性定义动画内容 "animations": [ { //表示动画数据来源 "samplers" : [ { //input对应accessors，2表示第2个序列数据，这个数据对应5个时间节点 "input" : 2, //动画数据只是关键帧，interpolation定义了中间过渡动画插值方法，LINEAR表示采用线性插值 "interpolation" : "LINEAR", //input对应accessors，3表示第3个序列数据，这个数据对应5个四元数表示的旋转 "output" : 3 } ], //通道，动画可以包含多个通道，每个通道一般都是简单的动画，多个通道组合可以产生复杂的动画效果 "channels" : [ { //对应samplers[0] "sampler" : 0, //指定动画的目标对应 "target" : { //对应nodes[0] "node" : 0, //这里表示nodes[0]中的rotation属性应该被执行 "path" : "rotation" } } ] } ], "buffers" : [ { "uri" : "data:application/octet-stream;base64,AAABAAIAAAAAAAAAAAAAAAAAAAAAAIA/AAAAAAAAAAAAAAAAAACAPwAAAAA=", "byteLength" : 44 }, //buffers[1]表示的旋转相关的数据，响应的解码后的十六进制见后面截图，共100个字节 { "uri" : "data:application/octet-stream;base64,AAAAAAAAgD4AAAA/AABAPwAAgD8AAAAAAAAAAAAAAAAAAIA/AAAAAAAAAAD0/TQ/9P00PwAAAAAAAAAAAACAPwAAAAAAAAAAAAAAAPT9ND/0/TS/AAAAAAAAAAAAAAAAAACAPw==", "byteLength" : 100 } ], "bufferViews" : [ { "buffer" : 0, "byteOffset" : 0, "byteLength" : 6, "target" : 34963 }, { "buffer" : 0, "byteOffset" : 8, "byteLength" : 36, "target" : 34962 }, // 对应buffers[1]，字节长度为100 { "buffer" : 1, "byteOffset" : 0, "byteLength" : 100 } ], "accessors" : [ { "bufferView" : 0, "byteOffset" : 0, "componentType" : 5123, "count" : 3, "type" : "SCALAR", "max" : [ 2 ], "min" : [ 0 ] }, { "bufferView" : 1, "byteOffset" : 0, "componentType" : 5126, "count" : 3, "type" : "VEC3", "max" : [ 1.0, 1.0, 0.0 ], "min" : [ 0.0, 0.0, 0.0 ] }, { //对应bufferViews[2] "bufferView" : 2, //起始偏移量为0 "byteOffset" : 0, //5126表示数据类型为FLOAT，占用4个字节 "componentType" : 5126, //有5组数据，共占用5x4=20字节，每个数据表示一个时间点 "count" : 5, //数据为标量 "type" : "SCALAR", "max" : [ 1.0 ], "min" : [ 0.0 ] }, { //对应bufferViews[2] "bufferView" : 2, //起始偏移量为20 "byteOffset" : 20, //5126表示数据类型为FLOAT，占用4个字节 "componentType" : 5126, //有5组数据，共占用5x(4x4)=80字节，每个数据对应一个四元数，表示对应时间点旋转的角度 "count" : 5, //数据为VEC4向量，使用4元数来表示旋转 "type" : "VEC4", "max" : [ 0.0, 0.0, 1.0, 1.0 ], "min" : [ 0.0, 0.0, 0.0, -0.707 ] } ], "asset" : { "version" : "2.0" } }

buffers[1][uri]base64解码后的十六进制表示，其中每四个字节表示一个浮点数，通过使用在线工具可以将它们转换为浮点数，由此得到一组旋转动画关键帧数据

时间

四元数

说明

0.0

(0.0, 0.0, 0.0, 1.0 )

在0.0秒，三角形旋转0°

0.25

(0.0, 0.0, 0.707, 0.707)

在0.25秒，三角形沿z轴旋转90°

0.5

(0.0, 0.0, 1.0, 0.0)

在0.5秒，三角形沿z轴旋转180°

0.75

(0.0, 0.0, 0.707, -0.707)

在0.75秒，三角形沿z轴旋转270°

1.0

(0.0, 0.0, 0.0, 1.0)

在1.0秒，三角形沿z轴旋转360°