cesium用鼠标绘制点、线

1、如图所示

2、封装代码

        //绘制
        drawPointLine() {
            this.isDrawPointLine = !this.isDrawPointLine;//用于判断是否绘制
            let that = this;
            let handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas);
            handler.setInputAction((e) => {
                //停止绘制
                if(this.isDrawPointLine == false){
                    handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);//移除事件放在这里才会起效果
                    return;
                }
                //笛卡尔坐标转换经纬度
                let ray = that.viewer.camera.getPickRay(e.position);
                let position = that.viewer.scene.globe.pick(ray, that.viewer.scene);
                let cartographic = Cesium.Cartographic.fromCartesian(position);
                let lon = Cesium.Math.toDegrees(cartographic.longitude);
                let lat = Cesium.Math.toDegrees(cartographic.latitude);
                console.log(lon,lat)
                //创建点
                let pointPrimitives = null;
                pointPrimitives = that.viewer.scene.primitives.add(new Cesium.PointPrimitiveCollection());
                pointPrimitives.add({
                    pixelSize: 10,
                    color: Cesium.Color['RED'],
                    position: Cesium.Cartesian3.fromDegrees(lon, lat),
                });
                //创建线
                that.drawPointLonLats.push(lon);
                that.drawPointLonLats.push(lat);
                that.viewer.entities.add({
                    name: 'line',
                    polyline: {
                        positions: Cesium.Cartesian3.fromDegreesArray(that.drawPointLonLats),
                        width: 2,
                        material: Cesium.Color.YELLOW,
                        clampToGround: true
                    }
                })
            }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
        },