设置相机视角及跟踪一个移动的实体

港控/mmm° 2023-06-30 09:04 11阅读 0赞

## 一、设置视角 ##

#### 1.通过setView设置相机视角 ####

// 通过设置相机位置目标点
    viewer.camera.setView({ 
        destination : new Cesium.Cartesian3(x, y, z),
        orientation: { 
            heading : headingAngle,
            pitch : pitchAngle,
            roll : rollAngle
        }
    });
    // 通过设置相机视野区域
    viewer.camera.setView({ 
        destination : Cesium.Rectangle.fromDegrees(west, south, east, north),
        orientation: { 
            heading : headingAngle,
            pitch : pitchAngle,
            roll : rollAngle
        }
    });

### 2.通过lookAt设置相机视角 ###

const posCenter = Cesium.Cartesian3(x,y,z) 
    const headingPitchRange = new Cesium.HeadingPitchRange(heading, pitch, range)
    camera.lookAt(pos, headingPitchRange )

## 二、 跟踪移动的实体 ##

#### 1、直接使用trackedEntity跟随 ####

const entity = viewer.entities.getById(id)
    viewer.trackedEntity = entity

> ps: 该方法简单，但是会出现两个问题：  
> 1、偏航角度无法更随  
> 2、移动物体可能会出现抖动现象

#### 2、通过使用上面的setView或lookAt设置视角跟随 ####

思路：当移动的entity实体改变位置时，立即调用setView或lookAt。  
坑：可能出现的问题或坑，动画会抖动  
如果跳出坑，务必保证在改变实体位置时的同时，修改视角。方可避免渲染问题

// 方法一： 添加preUpdate监听事件，在屏幕更新之前设置相机视角（）
    viewer.scene.preUpdate.addEventListener(()=>{ 
    // 该方法有坑，如果运动实体的渲染不在该事件方法中，可能会出现 渲染不同步，导致出现画面抖动现象 
    })

## 三、解除视角锁定 ##

通过使用setView或lookAt设置视角后，视角将锁定，鼠标无法拖动画面  
需要再次调用如下方向，可解除视角锁定

viewer.trackedEntity =undefined;
    viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);