• home > GIS > cesium >

    Cesium笔记(7): camera相机与视野,cesium地图移动缩放旋转配置

    Author:zhoulujun Date:

    相机可以控制我们在场景中的视野,默认的,相机操作是这样的:左键单击并拖动 - 移动整个地图右键单击并拖动 - 放大和缩小相机。中轮滚

    相机可以控制我们在场景中的视野,默认的,相机操作是这样的:

    • 左键单击并拖动 - 移动整个地图

    • 右键单击并拖动 - 放大和缩小相机。

    • 中轮滚动 - 也可以放大和缩小相机。

    • 中间点击并拖动 - 围绕地球表面的点旋转相机。

    官方文档:https://cesium.com/docs/cesiumjs-ref-doc/Camera.html

    从一个视野点查看地图,设置范例

    let { scene, camera ,screenSpaceCameraController} = viewer
    // 禁止默认的事件
    scene.screenSpaceCameraController.enableRotate = false;//禁止旋转
    scene.screenSpaceCameraController.enableTranslate = false;// 禁止移动
    scene.screenSpaceCameraController.enableZoom = false;//禁止缩放
    scene.screenSpaceCameraController.enableTilt = false;//禁止倾斜相机
    scene.screenSpaceCameraController.enableLook = false;
    let cameraHeight = 1.1e7
    //相机高度最小值,即控制放大级别
    screenSpaceCameraController.minimumZoomDistance = cameraHeight * 1.5
    //相机高度最大值,即控制缩小级别
    screenSpaceCameraController.maximumZoomDistance = cameraHeight * 3
    let pointDestination=Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0);//视野点
    let rectangleDestination=Cesium.Rectangle.fromDegrees(0,20,10,30);//视野区域,由[西,南,东,北]四个度数来构成
    scene.camera.setView({
       destination: pointDestination,
       orientation: {
         heading: 6.283185307179586,
         pitch: -1.5707963267948966,
         roll: 0
       }
    })

    相机的操作方式

    理论方面,可以参看《三维旋转笔记:欧拉角/四元数/旋转矩阵/轴角-记忆点整理


    Cesium,相机的旋转参数:

    • Roll是围绕X轴旋转

    • Pitch 是围绕Y轴旋转

    • Heading是围绕Z轴旋转

    Cesium操作摄像头的常用方法

    • flyHome(duration) 地图回到home, to set the default view for the 3D scene

    • flyTo(options),Flies the camera from its current position to a new position.

    • lookAt(target, offset):lookAt(center, new Cesium.HeadingPitchRange(Cesium.Math.toRadians(9), Cesium.Math.toRadians(9), 100))

    • setView(options),Sets the camera position, orientation and transform,有两种方式

      • Cartesian3:destination : Cesium.Cartesian3.fromDegrees(116.435314,39.960521, 15000.0),

      • rectangle: destination :Cesium.Rectangle.fromDegrees(0.0, 20.0, 10.0, 30.0),//west, south, east, north

    flyTo可以比setView,设置更多的参数

    view.camera.flyTo({  
      destination :Cesium.Cartesian3.fromDegrees(116.435314,39.960521, 15000.0), // 设置位置
      orientation: {    heading :Cesium.Math.toRadians(20.0), // 方向
        pitch :Cesium.Math.toRadians(-90.0),// 倾斜角度
        roll :0
      },  
      duration:5, // 设置飞行持续时间,默认会根据距离来计算
      complete:function () {//TODO}, // 到达位置后执行的回调函数
      cancle:function () {//TODO},   // 如果取消飞行则会调用此函数
      pitchAdjustHeight:-90, // 如果摄像机飞越高于该值,则调整俯仰俯仰的俯仰角度,并将地球保持在视口中。
      maximumHeight:5000, // 相机最大飞行高度
      flyOverLongitude:100, // 如果到达目的地有2种方式,设置具体值后会强制选择方向飞过这个经度(这个,很好用)});

    参考文章:

    Cesium学习笔记(四): 相机(camera) https://blog.csdn.net/UmGsoil/article/details/74518960



    转载本站文章《Cesium笔记(7): camera相机与视野,cesium地图移动缩放旋转配置》,
    请注明出处:https://www.zhoulujun.cn/html/GIS/cesium/8333.html