下面是我的一些步骤
- 使用简单的几何元素构建出飞机模型
- 制作2个小动画:螺旋桨旋转 和 机身摇晃
- 导出 .glb 格式模型
模型导入到 Babylon 的代码如下
主要用到2个参数 meshes 和 animationGroups
{
animationGroups: (2) [AnimationGroup, AnimationGroup]
geometries: (9) [Geometry, Geometry, Geometry, Geometry, Geometry]
lights: []
meshes: (10) [Mesh, Mesh, Mesh, Mesh, Mesh, Mesh, Mesh, Mesh, Mesh, Mesh]
particleSystems: []
skeletons: []
transformNodes: (5) [TransformNode, TransformNode, TransformNode]
__proto__: Object
代码
在这个项目主要实现一下几个环节
- 基本场景的搭建
- 飞机跟随鼠标的运动
- 粒子的生成和运动
- 飞机与粒子的碰撞
飞机模型的加载
// 加载飞机模型
private async loadPlane(): Promise<any> {
// 新建一个透明元素 包裹模型
const container = MeshBuilder.CreateBox('plane-container', {
width: 1, depth: 2, height:1 }, this.scene)
container.isVisible = false;
// 调整到与模型重合的位置
container.bakeTransformIntoVertices