Skip to content
Cesium实现最大倾斜角限制相机倾斜角度

需求

因为相机俯仰角经常仰视到90度的时候,就焦点乱飘,需要对俯仰角做限制,帮助防止用户最终陷入“地下”或通过快速移动鼠标倾斜相机以查看两个极端(+90 度、-90 度)而迷失在场景中。

Limiting Camera Tilting

解决

现阶段Cesium1.123版本已在ScreenSpaceCameraController中增加了maximumTiltAngle通过这个参数即可限制相机的角度 image.png

旧版本

若是Cesium旧版本可选择 1、直接参考Cesium1.123中ScreenSpaceCameraController类里面的这个参数的写法补上,然后重新打个包解决 2、使用issue中别人提高的代码,来解决(此代码可能存在部分滚动的问题),最好还是直接使用最新版本的maximumTiltAngle来解决,因为官方已经对这个参数进行过测试,而且迁移旧版本也不难。

javascript
var viewer = new Cesium.Viewer("cesiumContainer");
var globe = viewer.scene.globe;
var camera = viewer.scene.camera;

var scratchNormal = new Cesium.Cartesian3();
var previousPosition = new Cesium.Cartesian3();
var previousDirection = new Cesium.Cartesian3();
var previousUp = new Cesium.Cartesian3();
var previousRight = new Cesium.Cartesian3();

viewer.scene.postUpdate.addEventListener(function() {
  var normal = globe.ellipsoid.geodeticSurfaceNormal(
    camera.position,
    scratchNormal
  );

  var dotProduct = Cesium.Cartesian3.dot(camera.direction, normal);
  
  if (dotProduct >= -0.1) {
    camera.position = Cesium.Cartesian3.clone(previousPosition, camera.position);
    camera.direction = Cesium.Cartesian3.clone(previousDirection, camera.direction);
    camera.up = Cesium.Cartesian3.clone(previousUp, camera.up);
    camera.right = Cesium.Cartesian3.clone(previousRight, camera.right);
  } else {
    previousPosition = Cesium.Cartesian3.clone(camera.position, previousPosition);
    previousDirection = Cesium.Cartesian3.clone(camera.direction, previousDirection);
    previousUp = Cesium.Cartesian3.clone(camera.up, previousUp);
    previousRight = Cesium.Cartesian3.clone(camera.right, previousRight);
  }
});

Updated at: