# new KeyboardCameraController(viewer, options)
场景相机漫游工具,可以实现沉浸式的鼠标键盘漫游功能,具体操作方法如下:
1. 相机平移操作,这类操作不会改变相机的朝向,只会改变相机的位置:
W
:相机位置向前移动S
:相机位置向后移动A
:相机位置向左移动D
:相机位置向右移动Q
:相机位置升高E
:相机位置降低
2. 相对于相机视点操作,其中U
,O
,J
,L
操作会改变相机的位置,也会改变相机的朝向,而I
,K
操作只会改变相机相较视点的距离(在执行U
,O
,J
,L
操作时请勿同时执行其他按键操作):
I
:相机视角靠近屏幕中心点K
:相机视角远离屏幕中心点J
:绕屏幕中心点向左旋转L
:绕屏幕中心点向右旋转U
:绕屏幕中心点向上旋转O
:绕屏幕中心点向下旋转
3. 相机自身操作,这类操作不会改变相机的位置,只会改变相机的朝向(在全屏状态下可使用鼠标调整相机视角):
↑
:向上抬高视角↓
:向下降低视角←
:向左移动视角→
:向右移动视角
4. 鼠标操作:
- 开启鼠标操作功能后,页面将进入全屏模式,此时相机视角可通过鼠标移动进行操作
5. 辅助操作:
Shift
:加速相机平移操作,调整移动步长为原来的两倍R
:重置视角到初始视角,仅在参数initView
定义时有效
参数:
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
viewer |
Object | 三维地球场景的视图对象 |
|
options |
Object | 场景相机漫游工具的配置项 |
|
enableMouseLook |
Boolean | true | 是否开启鼠标控制模式,开启后将进入全屏模式,此时相机视角可通过鼠标移动进行操作 |
enableDynamicMoveStep |
Boolean | true | 是否开启动态移动步长,开启后将根据视角距离地面高度动态计算移动步长, |
enableCollisionDetection |
Boolean | false | 是否开启碰撞检测 |
mouseSensitivity |
Number | 10 | 鼠标灵敏度,该参数仅在鼠标控制模式下有效 |
moveStep |
Number | 5 | 移动步长,单位为米 |
rotateStep |
Number | 1 | 旋转步长,单位为度 |
initView |
Object | 初始视角,参数与 |
示例
// 参考示例:
http://webclient.smaryun.com/#/modules/cesium/sceneControl/camera/keyboard-roaming
// ES5引入方式
const { KeyboardCameraController } = zondy
// ES6引入方式
import { KeyboardCameraController } from "@mapgis/webclient-cesium-plugin"
// 初始化视图对象
let viewer = new Cesium.Viewer("cesiumContainer");
// 加载模型
let tilesetModel = viewer.scene.primitives.add(
new Cesium.Cesium3DTileset({
url: 'http://192.168.82.89:8200/3DData/ModelCache/3DTileset/1.0/dayantaresult/tileset.json'
})
);
// 视角定位到模型
viewer.zoomTo(tilesetModel);
// 实例化CameraRoamingTool对象
let cameraRoaming = new KeyboardCameraController(viewer, {
enableMouseLook: false,
enableDynamicMoveStep: false,
moveStep: 0.2,
initView: {
destination: Cesium.Cartesian3.fromDegrees(108.9594, 34.2184, 8),
orientation: {
heading: 0,
pitch: 0,
roll: 0
}
}
});
// 开启碰撞检测
cameraRoaming.enableCollisionDetection = true;
// 说明:当enableMouseLook参数为true时,开启漫游后页面将进入全屏模式,由于浏览器安全策
// 略的限制,此时start()方法必需由一个用户手势触发(如主动点击按钮),而不能由程序被动触发
// 开始漫游
cameraRoaming.start();
// 停止漫游
cameraRoaming.stop();
成员变量
Boolean
# enableMouseLook
获取或设置当前是否开启鼠标操作功能,当该参数为true时,开启漫游后页面将进入全屏模式,由于浏览器安全策略
的限制,此时start()
方法必需由一个用户手势触发(如主动点击按钮),而不能由程序被动触发