Cesium 实战 - AGI_articulations 扩展：模型自定义关节动作
Cesium 实战 - AGI_articulations 扩展：模型自定义关节动作
- 简要概述
- 两种方式实现模型组件动作
- 模型添加关节（articulations）
-
- 1.导入模型（J15.glb）
- 2.查看模型内部组件信息（名称）
- 4.将需要J15.glb复制到 public/model 文件夹下
- 5.导入J15.glb为glTF格式。
- 6.选中J-15.gltf，预览数据以及模型效果
- 7.在 J-15.gltf 同级目录下，创建 J-15.gmdf 文件
- 8.在J-15.gmdf添加自定义关节内容
- 9.将J-15.gmdf注入到J-15.gltf。
- 10.预览查看 J-15.gltf 的关节动作（articulations）
- 在线示例
最近的项目需要操作模型，除了模型本身的移动、飞行、属性、颜色等调整，还需要调整模型的组件。
比如需要模拟飞机打击目标，这样的话，需要给飞机上的导弹组件增加动作来实现需要的效果。
结合之前在看到的参考博客，经过各种尝试，总算是实现了效果，这里总结一下。
本文包括 简要概述、两种方式实现模型组件分离、模型添加关节（articulations）、在线示例 四部分。
简要概述
简要概述一下自己对模型组件动作的理解：
本身我是 java 出身，按照面向对象的思想来讲，模型应该作为一个独立的整体，而颜色、属性、动作等都属于模型对象，可以通过接口来修改属性，不应该直接修改模型的内置属性以及动作。
以下是 AGI_articulations 官方给出的解释也是契合面向对象思想的：
In glTF 2.0, the core animation system is geared towards the typical graphics industry usage pattern, where the model author(s) decide which parts of the model will move, as well as the exact nature and timing of those movements, at author time. It does not allow for a case where certain parts of the model are designated by the author as movable, but their exact movements are not known until after the model is built.
简单翻译：在 glTF 2.0 中，glTF 模型在设计之初便规定好了所有的性质、动作以及时间，此后则不允许直接修改。
对于同一个模型不同组件实现不同的动作，虽然不推荐，但是 glTF 模型提供了类似于接口的扩展，即 AGI_articulations。
使用模型的人可以通过 AGI_articulations 规则，对模型的组件自由添加动作，达到自己想要的效果。
但是通过 articulations 来实现模型组件动作，只能设置相对位置，比如相对于模型主体的 Y 轴方向偏离 1000 米，或者相对于模型主体旋转 90 度等等。这样的话，对于距离相关的动作，可能准确度会差一些，不如通过坐标来设置模型更实用。
因此，如果是简单动作，比如直升机翼旋转，车轮旋转等，可以通过关节（articulations ）动作的方式实现。
而比较复杂的动作，比如，实现航母编队以及航母上的战斗机飞行动作。
最好是将航母模型、编队战舰模型、战斗机模型等都拆解为一个一个独立的模型，分别控制这些模型的动作，来实现航母战斗群的效果。
比如：在某个时间段内（CZML），航母、编队以及战斗机同时在海上航行，当行进到设定好的时间节点，战斗机启动飞行动作，滑行一段时间之后起飞，与航母模型分离。
由于博客篇幅有限，本文只介绍模型添加关节（articulations），模型组件拆分为独立模型由下篇博客介绍。
两种方式实现模型组件动作
关于 Cesium 模型组件分离以及动作问题，初步想到两种实现方式，即模型组件拆解为独立模型和模型关节（articulations）动作：
1. 模型组件拆分为独立模型（可以通过 Blender 完成，本文不做详细介绍）
比如 Cesium 官方火箭模型，可以将火箭主体与推进器拆分为独立的模型组件，在通过 czml 在不同时刻分别描述其行进轨迹，实现模拟攻击效果。
2. 通过工具给模型增加关节动作（通过 Blender + gltf-vscode 完成，下文有详细介绍）
比如 Cesium 官方火箭模型，可以给推进器增加自定义关节动作（X、Y、Z轴的移动以及旋转等），实现模拟攻击效果。
经过实验，从实际效果来看，更推荐第一种方式，独立可控，位置精准！
由于博客篇幅有限，本文只介绍模型添加关节（articulations），模型组件拆分为独立模型由下篇博客介绍。
模型添加关节（articulations）
模型添加关节动作，可以通过 Blender + gltf-vscode 来完成，以下是操作步骤：
积分多的可以下载模型：J15.glb（积分少直接扒吧）！
1.导入模型（J15.glb）
（1）双击打开软件（以3.5为例） 
（2）选中默认元素，按 delete 删除，清空所有元素。
（3）点击File-import-gltf/glb，也可以选择导入其他格式（这里以 GLB 为例）。
（4）导入成功，模型会加载，右侧会显示所有组件名以及模型属性。
注意：如果不显示各个组件，可能是模型本身的原因。
2.查看模型内部组件信息（名称）
（1）选中模型组件，这里以J15正下方导弹为例
安住鼠标中键（滚轮），拖动调整模型视角：
（2）点击选中红框内的导弹，在右侧下滑查找选中的组件（选中的组件会变色）。
获取组件名称（J15_31）。
3.打开 gltf-vscode 项目，只能用 VScode 打开。
第一次使用 gltf-vscode，需要下载插件，可参考：Cesium 实战 - 通过 Blender 将模型组件拆解为独立子模型
默认打开 readme 文件，选择预览模式（右键-打开预览），可以查看项目介绍：
4.将需要J15.glb复制到 public/model 文件夹下
注意：GLB格式模型，不能直接预览，需要导入。
5.导入J15.glb为glTF格式。
（1）创建 j15 文件夹（GLB 转为 glFT 会拆解为多个文件，放入文件夹方便管理）
（2）在J15.glb右键 - glTF: Import from GLB
（3）选择 j15 文件夹，不建议修改名称，保存。
以下是转为glTF的文件结构，注意：所有文件均为依赖，不可删除。
6.选中J-15.gltf，预览数据以及模型效果
注意：需要在J-15.gltf文件内右键-glTF: Preview 3D Model
7.在 J-15.gltf 同级目录下，创建 J-15.gmdf 文件
注意后缀名以及 gltf 同级目录。
8.在J-15.gmdf添加自定义关节内容
这里设定好关节名称、动作名称、动作类型以及阈值等。（注意：不能添加注释！！！）
注意：关节名称和动作名称与 Cesium 使用时相对应！
比如：missiles MoveZ 对应 J-15.gmdf 的关节属性（missiles）中的动作（MoveZ）；number中的值处于MoveZ的阈值之间。
CZML 文件配置：
9.将J-15.gmdf注入到J-15.gltf。
（1）在 J-15.gltf 文件中右键 - command palette
（2）搜索 inject，选择 Inject GMDF into glTF
（3）查看J-15.gltf是否注入成功
检索查看是否包含 AGI_articulations：
10.预览查看 J-15.gltf 的关节动作（articulations）
（1）选择 Cesium 引擎
（2）调整关节参数，查看效果
PS：不知为何，图片一直违规，这里不得已把导弹马赛克一下！
总结：至此 glTF 增加关节已经完成，只要在 gltf-vscode 的 Cesium 引擎中可以预览，那么就可以通过 Cesium 代码在地球中加载渲染。
需要注意的是：gltf 和 gmdf 实际为 JSON 文件，因此不能添加注释！！！
在线示例
J15 模拟攻击示例
参考博客：
[1] AGI_articulations
[2] GLTF模型添加关节控制
[3] cesium里面控制gltf模型部件移动和旋转
[4] 三维模型下载与动画控制
[5] Model Articulations “Number” variable
[6] AnalyticalGraphicsInc
[7]:Cesium 源码解析 Model（三）
[8] czml-writer