动画基础
- setTimeout / setInterval 存在弊端
- window.requestAnimationFrame 性能更高
- 通过递归循环实现
相机分类
- FirstPersonControls 第一人称控件,类似于使用鼠标使相机移动
- FlyControls 飞行控件,通过键盘或者鼠标使相机移动
- RollControls 翻滚控件,飞行控件的简化版本,绕着z轴旋转
- TrackballControls 轨迹球控件,最常用的控件,可以用鼠标轻松的平移和缩放场景
- OrbitControls 轨迹控件,用于特定场景,模拟轨道中的卫星等等
- PathControls 路径控件,相机可以按照特定的路径进行移动,例如过山车等等
完整示例代码如下:
|
|
最终效果如下图:
轨迹球控件
属性
- THREE.TrackballControls(camera)创建
- rotateSpeed 转速
- zoomSpeed 变焦速度
- panSpeed 平移速度
完整示例代码如下:
|
|
最终效果如下图:
飞行控件
属性
- THREE.FlyControls(camera)创建
- movementSpeed 移动速度
- rollSpeed 转速
autoForward 自动前进
完整示例代码如下:
|
|
最终效果如下图:
翻滚控件
属性
- THREE.RollControls(camera) 创建
- movementSpeed 移动速度
- lookSpeed 观看速度
核心示例代码如下:
|
|
最终效果如下图:
第一人称控件
属性
- THREE.FirstPersonControls(camera) 创建
- movementSpeed 移动速度
- noFly 非飞行模式
lon/lat定位相机位置
核心示例代码如下:
|
|
最终效果如下图: