cesuim 相机视角沿着条线或者路匀速移动

程序员小凉

已于 2023-09-27 20:27:55 修改

阅读量185

点赞数 1

文章标签： javascript 前端开发语言

于 2023-09-27 17:40:45 首次发布

本文链接：https://blog.csdn.net/qq_63736937/article/details/133359208

版权

代码真实有效，测试过N多次

参数介绍

params 是一个二维数据 [[经度，纬度，高度]]，有高度的情况下不用设置heightNew的值，如果只有多个点经纬度没高度，可以设置统一的高度，这样就是在一个高度上执行，直接设置第三个参数 heightNew即可，它就会按照以设置的高度匀速前进

speed是速度越大速度越快根据自己需要来回测试即可

let removeEventListener=null;
// 视角匀速前进
export const flyCamera=(parmas,speed=200,heightNew=0)=>{
    // positions 格式是 [[经度,纬度],[经度,纬度]]  有高度可以加上高度
    let positions=parmas;
    let lastP = null;
    const t0 = viewer.clock.currentTime;
    let times = [t0];
    const route = new Cesium2.SampledPositionProperty();
    positions.map(item => {
        let p;
        if(heightNew){
            p= Cesium2.Cartesian3.fromDegrees(item[0],item[1],heightNew);
        }else{
             p = Cesium2.Cartesian3.fromDegrees(...item);
        }

        if (lastP != null) {
            const d = Cesium2.Cartesian3.distance(lastP, p);
            times.push(Cesium2.JulianDate.addSeconds(times[times.length - 1], d / speed, new Cesium2.JulianDate()));
        }
        lastP = p;
        route.addSample(times[times.length - 1], p);
        return p;
    });
    route.addSample(Cesium2.JulianDate.addDays(t0, 1, new Cesium2.JulianDate()), lastP);

    let destination, direction;
    const calcView = (t) => {
        const p = route.getValue(t);
        const pFront = route.getValue(Cesium2.JulianDate.addSeconds(t, 1, new Cesium2.JulianDate()));
        const direction0 = Cesium2.Cartesian3.subtract(p, pFront, new Cesium2.Cartesian3());
        Cesium2.Cartesian3.normalize(direction0, direction0);
        Cesium2.Cartesian3.multiplyByScalar(direction0, 3, direction0);
        const matrix = Cesium2.Transforms.eastNorthUpToFixedFrame(p);
        const pUp = Cesium2.Matrix4.multiplyByPoint(matrix, new Cesium2.Cartesian3(0, 0, 1), new Cesium2.Cartesian3());
        const up = Cesium2.Cartesian3.subtract(pUp, p, new Cesium2.Cartesian3());
        Cesium2.Cartesian3.normalize(up, up);
        const v = Cesium2.Cartesian3.add(direction0, up, new Cesium2.Cartesian3());
        Cesium2.Cartesian3.normalize(v, v);
        destination = Cesium2.Cartesian3.add(p, Cesium2.Cartesian3.multiplyByScalar(v, 1000, new Cesium2.Cartesian3()), new Cesium2.Cartesian3());
        direction = Cesium2.Cartesian3.subtract(p, destination, new Cesium2.Cartesian3());
        Cesium2.Cartesian3.normalize(direction, direction);
    };

    calcView(t0);
    viewer.camera.flyTo({
        destination,
        orientation: {
            direction,
            up: Cesium2.Cartesian3.ZERO
        },
        complete: () => {
             removeEventListener = viewer.scene.postRender.addEventListener((scene, t) => {
                if (Cesium2.JulianDate.greaterThanOrEquals(t, times[times.length - 1])) {
                    removeEventListener();
                    return;
                }
                calcView(t);
                viewer.camera.setView({
                    destination,
                    orientation: {
                        direction,
                        up: Cesium2.Cartesian3.ZERO
                    }
                });
            });
            viewer.clock.shouldAnimate = true;
        }
    });
}
//退出视角前进
export const exitFlyCamera=()=>{
    removeEventListener?removeEventListener():'';
}