canvas

视角

// setView瞬间到达指定位置，视角 flyTo动态飞往
// 天安门position
var position = Cesium.Cartesian3.fromDegrees(116.397428, 39.90923, 100)
viewer.camera.flyTo({
  // 指定相机位置
  destination: position,
  // 设置相机视角
  orientation: {
    // 相机朝向
    heading: Cesium.Math.toRadians(0),
    // 相机俯仰角 -90向下
    path: Cesium.Math.toRadians(-90),
    // 相机翻滚角度
    roll: 0,
  },
})

事件

document.addEventListener('keydown', function (e) {
  var moveRate = viewer.camera.positionCartographic.height / 100
  switch (e.key) {
    case 'w':
      viewer.camera.moveForward(moveRate)
      break
    case 's':
      viewer.camera.moveBackward(moveRate)
      break
    case 'a':
      viewer.camera.moveLeft(moveRate)
      break
    case 'd':
      viewer.camera.moveRight(moveRate)
      break
    case 'q':
      viewer.camera.lookLeft(Cesium.Math.toRadians(0.1))
      break
    case 'e':
      viewer.camera.lookRight(Cesium.Math.toRadians(0.1))
      // lookUp 向上看
      // lookDown 向下看
      // twistRight 翻滚
      break
    default:
      break
  }
})

添加自带三维模型建筑

var model = viewer.scene.primitives.add(new Cesium.createOsmBuildings())