cesium+ionic4移动端双击旋转

cesium+ionic4移动端双击旋转

• this.viewer.zoomTo(entity, offset);绕实体标记点旋转

rotateHandle() {
        let entity: any
        let clickNum = 0
        let viewer = this.viewer
        let rotateShow: boolean = true
        this.mouseHandler.setInputAction((movement) => {
            clickNum += 1
            clearTimeout(this.timer);

            setTimeout(function () {
                clickNum = 0
            }, 200)
            if (clickNum == 2) {
                rotateShow = !rotateShow
                if(!rotateShow){
                    let imgUrl = "assets/img/mark-transparent.svg"
                    let position = this.viewer.scene.pickPosition(movement.position) //笛卡尔3
                    entity = this.viewer.entities.add({
                        position: position,
                        billboard: {
                            image: imgUrl,
                            // scale: 1,
                            scaleByDistance: new Cesium.NearFarScalar(2000,0.5, 8000, 0),
                            disableDepthTestDistance : Number.POSITIVE_INFINITY,
                        },
                    });
                }
                console.log('movement', movement);
                let rotate = ()=> {
                    this.heading += 1;
                    let  offset = new Cesium.HeadingPitchRange(Cesium.Math.toRadians(this.heading), Cesium.Math.toRadians(-30), 1000);
                    this.viewer.zoomTo(entity, offset);
                    this.viewer.scene.screenSpaceCameraController.enableInputs = true;

                    if (rotateShow) {
                        viewer.clock.onTick.removeEventListener(rotate);

                        viewer.scene.screenSpaceCameraController.enableInputs = true
                        clickNum = 0
                        this.viewer.entities.remove(entity)
                    }
                }
                if (!rotateShow) {
                    this.viewer.clock.onTick.addEventListener(rotate)
                    clickNum = 0
                    clearTimeout(this.timer);
                    
                }
            }
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    }

•  viewer.scene.camera.setView根据相机的视角进行旋转

rotateHandle1() {
        let viewer = this.viewer;
        let clickNum = 0
        let rotateShow = true;

        // 相机看点的角度，如果大于0那么则是从地底往上看，所以要为负值，这里取-30度
        var pitch = Cesium.Math.toRadians(-30);
        // 给定飞行一周所需时间，比如10s, 那么每秒转动度数
        var angle = 360 / 10;
        // 给定相机距离点多少距离飞行，这里取值为5000m
        var distance = 300; // 当前相机高度
        var startTime = Cesium.JulianDate.fromDate(new Date());

        var stopTime = Cesium.JulianDate.addSeconds(startTime, 10, new Cesium.JulianDate());

        viewer.clock.startTime = startTime.clone();  // 开始时间
        viewer.clock.stopTime = stopTime.clone();     // 结速时间
        viewer.clock.currentTime = startTime.clone(); // 当前时间
        viewer.clock.clockRange = Cesium.ClockRange.CLAMPED; // 行为方式
        viewer.clock.clockStep = Cesium.ClockStep.SYSTEM_CLOCK; // 时钟设置为当前系统时间; 忽略所有其他设置。
        // 相机的当前heading
        var initialHeading = viewer.camera.heading;

        this.mouseHandler.setInputAction((movement) => {

            clickNum += 1
            console.log(clickNum);
            clearTimeout(this.timer);

            setTimeout(function () {
                clickNum = 0
            }, 200)
            if (clickNum == 2) {
                rotateShow = !rotateShow
                let position = this.viewer.scene.pickPosition(movement.position)
                console.log('movement', movement);
                var Exection = function TimeExecution() {
                    // 当前已经过去的时间，单位s
                    var delTime = Cesium.JulianDate.secondsDifference(viewer.clock.currentTime, viewer.clock.startTime);
                    var heading = Cesium.Math.toRadians(delTime * angle) + initialHeading;
                    viewer.scene.camera.setView({
                        destination: position, // 点的坐标
                        orientation: {
                            heading: heading,
                            pitch: pitch,
                        }
                    });
                    viewer.scene.camera.moveBackward(distance);
                    console.log('rotateShow', rotateShow);

                    if (rotateShow) {
                        viewer.clock.onTick.removeEventListener(Exection);
                        clickNum = 0
                    }
                }
                if (!rotateShow) {
                    viewer.clock.onTick.addEventListener(Exection);
                    clickNum = 0
                }
            }
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    }

• 相机的视角进行旋转一周

rotateHandle1() {
        let viewer = this.viewer;
        let clickNum = 0
        let rotateShow = true;

        // 相机看点的角度，如果大于0那么则是从地底往上看，所以要为负值，这里取-30度
        var pitch = Cesium.Math.toRadians(-30);
        // 给定飞行一周所需时间，比如10s, 那么每秒转动度数
        var angle = 360 / 10;
        // 给定相机距离点多少距离飞行，这里取值为5000m
        var distance = 300; // 当前相机高度
        var startTime = Cesium.JulianDate.fromDate(new Date());

        var stopTime = Cesium.JulianDate.addSeconds(startTime, 10, new Cesium.JulianDate());

        viewer.clock.startTime = startTime.clone();  // 开始时间
        viewer.clock.stopTime = stopTime.clone();     // 结速时间
        viewer.clock.currentTime = startTime.clone(); // 当前时间
        viewer.clock.clockRange = Cesium.ClockRange.CLAMPED; // 行为方式
        viewer.clock.clockStep = Cesium.ClockStep.SYSTEM_CLOCK; // 时钟设置为当前系统时间; 忽略所有其他设置。
        // 相机的当前heading
        var initialHeading = viewer.camera.heading;

        this.mouseHandler.setInputAction((movement) => {

            clickNum += 1
            console.log(clickNum);
            clearTimeout(this.timer);

            setTimeout(function () {
                clickNum = 0
            }, 200)
            if (clickNum == 2) {
                rotateShow = !rotateShow
                let position = this.viewer.scene.pickPosition(movement.position)
                console.log('movement', movement);
                var Exection = function TimeExecution() {
                    // 当前已经过去的时间，单位s
                    var delTime = Cesium.JulianDate.secondsDifference(viewer.clock.currentTime, viewer.clock.startTime);
                    var heading = Cesium.Math.toRadians(delTime * angle) + initialHeading;
                    viewer.scene.camera.setView({
                        destination: position, // 点的坐标
                        orientation: {
                            heading: heading,
                            pitch: pitch,
                        }
                    });
                    viewer.scene.camera.moveBackward(distance);
                    if (Cesium.JulianDate.compare(viewer.clock.currentTime, viewer.clock.stopTime) >= 0) {
                        viewer.clock.onTick.removeEventListener(Exection);
                        clickNum = 0
                    }
                    //console.log('rotateShow', rotateShow);

                    //if (rotateShow) {
                    //  viewer.clock.onTick.removeEventListener(Exection);
                    //   clickNum = 0
                   //}
                }
                if (!rotateShow) {
                    viewer.clock.onTick.addEventListener(Exection);
                    clickNum = 0
                }
            }
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    }