Class: KeyboardCameraController

KeyboardCameraController

new KeyboardCameraController(viewer, options)

engineExtensions/tools/KeyboardCameraController.js, line 2

场景相机漫游工具，可以实现沉浸式的鼠标键盘漫游功能，具体操作方法如下：

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定义时有效
Name Type Description
viewer Object

三维地球场景的视图对象
options Object

场景相机漫游工具的配置项

Name Type Default Description
enableMouseLook Boolean true 可选

是否开启鼠标控制模式，开启后将进入全屏模式，此时相机视角可通过鼠标移动进行操作
enableDynamicMoveStep Boolean true 可选

是否开启动态移动步长，开启后将根据视角距离地面高度动态计算移动步长，moveStep参数将不再生效
enableCollisionDetection Boolean false 可选

是否开启碰撞检测
mouseSensitivity Number 10 可选

鼠标灵敏度，该参数仅在鼠标控制模式下有效
moveStep Number 5 可选

移动步长，单位为米
rotateStep Number 1 可选

旋转步长，单位为度
initView Object 可选

初始视角，参数与Camera#setView方法相同，开始漫游时视角将重置到该视角，若不设置则默认从当前视角开始漫游
Example

场景相机键盘漫游

// 参考示例：
http://10.10.130.72:8086/#/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();

Members

enableCollisionDetectionBoolean

获取或设置当前是否开启碰撞检测

enableDynamicMoveStepBoolean

获取或设置当前是否开启动态移动步长

enableMouseLookBoolean

获取或设置当前是否开启鼠标操作功能，当该参数为true时，开启漫游后页面将进入全屏模式，由于浏览器安全策略 的限制，此时start()方法必需由一个用户手势触发（如主动点击按钮），而不能由程序被动触发

initViewObject

获取或设置初始视角

mouseSensitivityNumber

获取或设置鼠标灵敏度

moveStepNumber

获取或设置移动步长

rotateStepNumber

获取或设置旋转角度

Methods

start()

engineExtensions/tools/KeyboardCameraController.js, line 293

开始场景相机漫游

stop()

engineExtensions/tools/KeyboardCameraController.js, line 553

停止场景相机漫游，若在全屏状态下，则无需调用该方法停止场景相机漫游，只需要按下ESC或F11