Cesium orientation 和设置初始角度

以你之姓@ 2022-09-14 11:24 396阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 1]

一. Cesium orientation

orientation-相机镜头对准的方法.
    
    heading-代表镜头左右方向,正值为右,负值为左,360度和0度是一样的
    pitch-代表镜头上下方向,正值为上,负值为下.
    roll-代表镜头左右倾斜.正值,向右倾斜,负值向左倾斜

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 2]  
二. 设置初始化角度  
1.先用鼠标手动调整出你想要的角度

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 3]

这里viewer是new出来的地图实例

打印出你调整好位置的实例的参数

console.log(viewer.scene.camera.heading);
    console.log(viewer.scene.camera.pitch);
    console.log(viewer.scene.camera.roll);
    console.log(viewer.scene.camera.position)

![在这里插入图片描述][2021020316500545.png]  
3.根据对应的参数去设置，具体设置方式如下

var initialPosition = new Cesium.Cartesian3(-2704200.415014977, 4702023.785328262, 3345501.4084866922); // 相机的位置
    
    var orientation = {
        heading: 6.283185307179586,
        // 视角
        pitch: -1.5686521559334161,
        roll: 0,
    };
    var homeCameraView = {
        destination: initialPosition, // 相机的位置
        orientation: orientation,
    };
    
    viewer.scene.camera.setView(homeCameraView);

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70]: /images/20220828/a560befb320e483588b80753d35da0a4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 1]: /images/20220828/fa0e9bfbab084e1c928d20a872bdf032.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 2]: /images/20220828/4ea446efc2df4ab3a87fad3fd04792dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poZW5nc2hhb2Zlbmcx_size_16_color_FFFFFF_t_70 3]: /images/20220828/ddc5e7315dc24b4199e79ad1d61fecbc.png
[2021020316500545.png]: /images/20220828/e268dfa378534874be2380de3ea41ed1.png