飞行控件
更新时间: 2021-08-30 14:07:16
接下来我们要看的控件是FlyControls。通过FlyControls你可以使用类似飞行模拟器操控杆的控件，在场景中飞行。
你可以用下面的方式来操控相机：
| 操控 | 动作 | 操控 | 动作 |
|---|---|---|---|
| 按住左键和中键 | 往前移动 | D | 右移 |
| 按住右键 | 往后移动 | R | 上移 |
| 移动鼠标 | 往四周看 | F | 下移 |
| w | 往前移动 | 上下左右方向键 | 上下左右看 |
| S | 往后移动 | G | 向左翻滚 |
| A | 左移 | E | 向右翻滚 |
var domEl = document.getElementById("three1")
var stats = initStats(0,domEl)
var renderer = initRenderer(domEl)
var camera = initCamera(domEl)
var scene = new THREE.Scene()
var clock = new THREE.Clock()
initDefaultLighting(scene)
var flyControls = new FlyControls(camera,domEl)
flyControls.movementSpeed = 25
//flyControls.domElement = domEl
flyControls.rollSpeed = Math.PI / 24
flyControls.autoForward = true //自动向前移动
flyControls.dragToLook = false
var loader = new OBJLoader()
loader.load("/daodao-knowledge/models/city.obj",function(object) {
var scale = chroma.scale(['red', 'green', 'blue']);
setRandomColors(object, scale);
var mesh = object ;
scene.add(mesh);
})
render()
function render() {
stats.update()
flyControls.update(clock.getDelta())
requestAnimationFrame(render)
renderer.render(scene,camera)
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33