- 先将官网的整体布局实现,背景使用canvas画布并置于底层
- 通过布局留出来的空白位置,等待加载模型
- 定义两个变量,将画布和控制页面展示的参数初始化,并在onMounted中赋值
- 创建环境,加载环境并渲染到画布上
- 加载模型,如想要模型能动起来就在加载的回调函数中监听鼠标的移动事件
- 当滚动鼠标滚轮时,想要不同的模型出现在不同的页面,就加载不同模型,但位置要呈一定的倍数关系,并监听滚轮事件
- 实例化创建球体,并生成多个,通过for循环和随机函数让xyz的坐标随机,并添加到矩阵中,然后设置实例化球体的每一个与该矩阵相同
- 如果想要球体大小不一致,可以设置matrix.makeScale(size,size,size),size也是随机生成
- 通过补间动画让球体移动