【Cesium】【vue】空间查询——量距(测量距离)、量面(测量面积)

一.量距

// 距离测量
    measureLineSpace() {
   
        this.removeMeasure();
        let _this = this;
        let viewer = this.viewer;
        // 取消双击事件-追踪该位置
        viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);

        this.distancehandler = new Cesium.ScreenSpaceEventHandler(viewer.scene._imageryLayerCollection);
        let positions = [];
        let poly = null;
        var distance = 0;
        var cartesian = null, floatingPointArray = [];

        this.distancehandler.setInputAction(function (movement) {
   
            let ray = viewer.camera.getPickRay(movement.endPosition);
            cartesian = viewer.scene.globe.pick(ray, viewer.scene);
            if (positions.length >= 2) {
   
                if (!Cesium.defined(poly)) {
   
                    poly = new PolyLinePrimitive(positions);
                } else {
   
                    positions.pop();
                    // cartesian.y += (1 + Math.random());
                    positions.push(cartesian);
                }
                distance = getSpaceDistance(positions);
            }
        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

        this.distancehandler.setInputAction(function (movement) {
   
            let ray = viewer.camera.getPickRay(movement.position);
            cartesian = viewer.scene.globe.pick(ray, viewer.scene);
            if (positions.length == 0) {
   
                positions.push(cartesian.clone());
            }
            positions.push(cartesian);
            //在三维场景中添加Label
            var textDisance = distance + "米";
            // console.log(textDisance + ",lng:" + cartographic.longitude/Math.PI*180.0);
            _this.floatingPoint = viewer.entities.add({
   
                name: '空间直线距离',
                position: positions[positions.length - 1],
                point: {
   
                    pixelSize: 4,
                    color: Cesium.Color.RED,
                    outlineColor: Cesium.Color.WHITE,
                    outlineWidth: 2,
                },
                label: {
   
                    text: textDisance,
                    font: '18px sans-serif',
                    fillColor: Cesium.Color.GOLD,
                    style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                    outlineWidth: 2,
                    verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                    pixelOffset: new Cesium.Cartesian2(20, -20),
                }
            });

            floatingPointArray.push(_this.floatingPoint);
            _this.distancepointArray = floatingPointArray;
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

        this.distancehandler.setInputAction(function (movement) {
   
            _this.distancehandler.destroy(); //关闭事件句柄
            positions.pop(); //最后一个点无效

        }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);

        var PolyLinePrimitive = (function () {
   
            fu