代码更新

Surpriseplus

2023-10-10 77f9937b32f67f5b7d5476b0a1db19956702c0c8

 src/assets/js/Map/menuTool.js

@@ -5,6 +5,7 @@
import CryptoJS from "crypto-js";
// import { Store } from "vuex";
import store from "@/store";
import temporaryTool from "./temporaryTools";
const menuTool = {
  toolMenu: null,
  toolFlag: null,
@@ -74,12 +75,15 @@
        this.snapshot();
        break;
      case "f2": //点查询
        this.setClearLocation('空间查询_标绘');
        this.spatialPointQuery();
        break;
      case "f3": //线查询
        this.setClearLocation('空间查询_标绘');
        this.spatialLineQuery();
        break;
      case "f4": //面查询
        this.setClearLocation('空间查询_标绘');
        this.spatialQuery();
        break;
      case "g1": //坐标定位
@@ -104,29 +108,15 @@
    if (this.localPoint) {
      this.setLocalPositionClose();
    }
    // var position = {
    //   X: parseFloat(res.lon),
    //   Y: parseFloat(res.lat),
    //   Altitude: parseFloat(res.alt),
    // };
    // this.localPoint = window.sgworld.Creator.CreateImageLabel(
    //   position,
    //   config.StaticFileBaseUrl + "/Workers/image/mark.png",
    //   {},
    //   0,
    //   "标签点"
    // );
    // var id = this.localPoint.item.id;
    // window.sgworld.Navigate.flyToObj(this.localPoint.item);
    this.localPoint = window.Viewer.entities.add({
      name: '坐标定位',
      position: Cesium.Cartesian3.fromDegrees(parseFloat(res.lon), parseFloat(res.lat), res.alt == null ? parseFloat(res.alt) : 0),
      position: Cesium.Cartesian3.fromDegrees(parseFloat(res.lon), parseFloat(res.lat), res.alt == null ? 0 : parseFloat(res.alt)),
      billboard: {
        image: config.StaticFileBaseUrl + '/Workers/image/location.png',
        // 设置贴地
        heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4),
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
        scale: 1.0,
        scale: 0.3,
      },
    });
    this.setViewerFlyTo(this.localPoint)
@@ -196,17 +186,23 @@
        var line_data = this.setCartesianToEightFour(res[i])
        std.push([line_data.lng, line_data.lat])
      }
      sgworld.Creator.SimpleGraphic.clear();
      this.setShowSpatialShp(std, 'polyline')


      var line = turf.lineString(std, { name: "polyline" })
      var restVal = turf.buffer(line, this.bufferSize, { units: "meters" })
      that.setSpatialQuery(restVal)
    });
  },

  spatialPointQuery() {
    var that = this;
    sgworld.Creator.createSimpleGraphic('point', {}, (entity) => {
      var res = entity.position.getValue();
      var val = that.setCartesianToEightFour(res)
      sgworld.Creator.SimpleGraphic.clear();
      that.setShowSpatialShp(val, 'Point')
      var options = {
        steps: 10,
        units: "meters",
@@ -216,6 +212,59 @@
      that.setSpatialQuery(circle)
    });
  },
  setShowSpatialShp(res, type) {
    var position = [];

    var name = '空间查询_标绘'
    switch (type) {
      case 'polyline':
        for (var i in res) {
          position.push(res[i][0], res[i][1])
        }
        window.Viewer.entities.add({
          name: name,
          polyline: {
            positions: Cesium.Cartesian3.fromDegreesArray(position),
            width: 10.0,
            material: new Cesium.PolylineOutlineMaterialProperty({
              color: Cesium.Color.GREEN.withAlpha(0.2),
              outlineWidth: 1,
              outlineColor: Cesium.Color.WHITE,
            }),
            clampToGround: true,

          },
        })
        break;
      case 'Point':
        window.Viewer.entities.add({
          name: name,
          position: Cesium.Cartesian3.fromDegrees(res.lng, res.lat),
          point: {
            color: Cesium.Color.GREEN.withAlpha(0.2),
            pixelSize: 20,
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
          }
        });
        break;
      case 'Polygon':
        window.Viewer.entities.add({
          name: name,
          polygon: {
            hierarchy: { positions: Cesium.Cartesian3.fromDegreesArray(res) },
            outline: true,
            outlineWidth: 100,
            arcType: Cesium.ArcType.RHUMB,
            material: Cesium.Color.GREEN.withAlpha(0.2),
            outline: true, // height is required for outline to display
            outlineColor: Cesium.Color.WHITE,
          }
        });
        break;
    }

  },

  setCartesianToEightFour(res) {
    var std = {}
    let ellipsoid = Viewer.scene.globe.ellipsoid
@@ -243,6 +292,10 @@
        var south = Cesium.Math.toDegrees(
          entity.rectangle._coordinates.getValue().south
        ); // 根据弧度获取到纬度

        var arr = [west, north, east, north, east, south, west, south, west, north];
        this.setShowSpatialShp(arr, 'Polygon')

        sgworld.Creator.SimpleGraphic.clear();

        var polygon = turf.polygon([
@@ -387,15 +440,9 @@
    var south1 = ss[1];
    this.exportSquare = ss;
    var geometry = Cesium.Rectangle.fromDegrees(west1, south1, east1, north1);



    Viewer.camera.setView({
      destination: Cesium.Rectangle.fromDegrees(west, south, east, north),
    });



    setTimeout(() => {
      window.functionForJs({
        type: "exportMap",
@@ -405,12 +452,182 @@
  },
  // 创建图形
  createSimpleGraphic(type, scene) {
    var that = this;
    sgworld.Creator.createSimpleGraphic(type, {}, (entity) => {

      if (scene === "square") {
        this.createRectangle(entity);
      }
      if (!scene) {
        temporaryTool.setInsertEntityObj(type, entity)
      }
    });
  },
  getEntityAttribute(type, res) {
    var obj = {}
    store.state.temporaryLayer = null;
    if (type == 'point') {
      var mataColor = res.point.color._value;
      var outlineColor = res.point.outlineColor._value;

      obj = {
        id: (new Date()).getTime(),
        cnName: res.name,
        metaAlpha: mataColor.alpha,
        outlineAlpha: outlineColor.alpha,
        metaColor: this.colorRgbToHex('rgb(' + (mataColor.red * 255) + ',' + (mataColor.green * 255) + ',' + (mataColor.blue * 255) + ')'),
        outlineColor: this.colorRgbToHex('rgb(' + (outlineColor.red * 255) + ',' + (outlineColor.green * 255) + ',' + (outlineColor.blue * 255) + ')'),
        pixelSize: res.point.pixelSize._value,
        outlineWidth: res.point.outlineWidth._value,
        near: res.point._distanceDisplayCondition._value.near,
        far: res.point._distanceDisplayCondition._value.far,
        geometry: this.setCartesianToEightFour(res.position.getValue()),
        type: 'point',
        shpType: 'temporaryLayer',
        layerType: '基本点',

      }

    } else if (type == 'label') {
      var mataColor = res.label.fillColor._value;
      var outlineColor = res.label.outlineColor._value;
      var backColor = res.label.backgroundColor._value;
      obj = {
        id: (new Date()).getTime(),
        cnName: res.name,
        text: res.label.text._value,
        font: res.label.font._value,
        metaAlpha: mataColor.alpha,
        outlineAlpha: outlineColor.alpha,
        backAlpha: backColor.alpha,
        backColor: this.colorRgbToHex('rgb(' + (backColor.red * 255) + ',' + (backColor.green * 255) + ',' + (backColor.blue * 255) + ')'),
        metaColor: this.colorRgbToHex('rgb(' + (mataColor.red * 255) + ',' + (mataColor.green * 255) + ',' + (mataColor.blue * 255) + ')'),
        outlineColor: this.colorRgbToHex('rgb(' + (outlineColor.red * 255) + ',' + (outlineColor.green * 255) + ',' + (outlineColor.blue * 255) + ')'),
        scale: res.label.scale._value,
        verticalOrigin: Cesium.VerticalOrigin.CENTER,//垂直位置
        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,//水平位置
        outlineWidth: res.label.outlineWidth._value,
        showBackground: false,
        outline: true,
        near: res.label._distanceDisplayCondition._value.near,
        far: res.label._distanceDisplayCondition._value.far,
        geometry: this.setCartesianToEightFour(res.position.getValue()),
        type: 'label',
        shpType: 'temporaryLayer',
        layerType: '文本点',
        heightReference: true,
        checked: true
      }

    } else if (type == 'polygon') {
      var mataColor = res.polygon.material.color._value;
      var outlineColor = res.polygon.outlineColor._value;
      var val = res.polygon.hierarchy.getValue().positions;
      var geom = [];
      for (var i in val) {
        var coord = this.setCartesianToEightFour(val[i])
        geom.push(coord.lng, coord.lat)
      }
      obj = {
        id: (new Date()).getTime(),
        cnName: res.name,
        metaAlpha: mataColor.alpha,
        outlineAlpha: outlineColor.alpha,
        metaColor: this.colorRgbToHex('rgb(' + (mataColor.red * 255) + ',' + (mataColor.green * 255) + ',' + (mataColor.blue * 255) + ')'),
        outlineColor: this.colorRgbToHex('rgb(' + (outlineColor.red * 255) + ',' + (outlineColor.green * 255) + ',' + (outlineColor.blue * 255) + ')'),
        near: res.polygon._distanceDisplayCondition._value.near,
        far: res.polygon._distanceDisplayCondition._value.far,
        geometry: geom,
        type: 'polygon',
        shpType: 'temporaryLayer',
        layerType: '多边形',
        heightReference: true,
        checked: true
      }
    } else if (type == 'polyline') {

      var mataColor = res.polyline.material.color._value;
      var outlineColor = res.polyline.material.outlineColor._value;
      var val = res.polyline.positions.getValue();
      var geom = [];
      for (var i in val) {
        var coord = this.setCartesianToEightFour(val[i])
        geom.push([coord.lng, coord.lat])
      }
      obj = {
        id: (new Date()).getTime(),
        cnName: res.name,
        metaColor: this.colorRgbToHex('rgb(' + (mataColor.red * 255) + ',' + (mataColor.green * 255) + ',' + (mataColor.blue * 255) + ')'),
        outlineColor: this.colorRgbToHex('rgb(' + (outlineColor.red * 255) + ',' + (outlineColor.green * 255) + ',' + (outlineColor.blue * 255) + ')'),
        near: res.polyline._distanceDisplayCondition._value.near,
        far: res.polyline._distanceDisplayCondition._value.far,
        metaAlpha: mataColor.alpha,
        outlineAlpha: outlineColor.alpha,
        outlineWidth: res.polyline.material.outlineWidth._value,
        width: res.polyline.width,
        geometry: geom,
        type: 'polyline',
        shpType: 'temporaryLayer',
        layerType: '线',
        heightReference: true,
        checked: true
      }
    } else if (type === 'rectangle') {

      var mataColor = res.rectangle.material.color._value;
      var outlineColor = res.rectangle.outlineColor._value;
      var west = Cesium.Math.toDegrees(
        res.rectangle._coordinates.getValue().west
      ); // 根据弧度获取到经度
      var east = Cesium.Math.toDegrees(
        res.rectangle._coordinates.getValue().east
      ); // 根据弧度获取到纬度
      var north = Cesium.Math.toDegrees(
        res.rectangle._coordinates.getValue().north
      ); // 根据弧度获取到经度
      var south = Cesium.Math.toDegrees(
        res.rectangle._coordinates.getValue().south
      ); // 根据弧度获取到纬度
      var geom = [west, south, east, north]
      obj = {
        id: (new Date()).getTime(),
        cnName: res.name,
        metaColor: this.colorRgbToHex('rgb(' + (mataColor.red * 255) + ',' + (mataColor.green * 255) + ',' + (mataColor.blue * 255) + ')'),
        outlineColor: this.colorRgbToHex('rgb(' + (outlineColor.red * 255) + ',' + (outlineColor.green * 255) + ',' + (outlineColor.blue * 255) + ')'),
        near: res.rectangle._distanceDisplayCondition._value.near,
        far: res.rectangle._distanceDisplayCondition._value.far,
        metaAlpha: mataColor.alpha,
        outlineAlpha: outlineColor.alpha,
        outlineWidth: res.rectangle.outlineWidth._value,
        rotation: 0,
        geometry: geom,
        type: 'rectangle',
        shpType: 'temporaryLayer',
        layerType: '矩形',
        heightReference: true,
      }
    }

    store.state.temporaryLayer = obj;

  },

  colorRgbToHex(str) {

    let reg = /^(rgb|RGB)/;
    if (!reg.test(str)) { return; }
    var rgb = str.slice(4, str.length - 1).split(",")
    // 将RGB色号拆分为红、绿、蓝三个通道的值
    var r = parseInt(rgb[0]);
    var g = parseInt(rgb[1]);
    var b = parseInt(rgb[2]);


    return "#" + ((r << 16) | (g << 8) | b).toString(16).padStart(6, '0');


  },

  //在线制图
  setThematicMap() {
    earthCtrl.coreMap.scene.mode = SmartEarth.Cesium.SceneMode.SCENE2D;
@@ -577,7 +794,6 @@
  //空间查询属性定位
  spaceLocation(res) {
    var name = '空间查询';

    this.setClearLocation(name);
    switch (res.type) {
      case 'MultiPolygon':
@@ -617,12 +833,20 @@
        outline: true,
        outlineWidth: 100,
        arcType: Cesium.ArcType.RHUMB,
        material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4),
        material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5),
        outline: true, // height is required for outline to display
        outlineColor: Cesium.Color.DODGERBLUE,
      }

    });
    this.setViewerFlyTo(locationPolygonEntity)
    window.Viewer.flyTo(locationPolygonEntity, {
      offset: {
        heading: Cesium.Math.toRadians(0.0),
        pitch: Cesium.Math.toRadians(-90),
        range: 0
      }
    }
    );
  },
  setLocationPoint(res, name) {
    const position = window.Viewer.entities.add({
@@ -631,13 +855,19 @@
      billboard: {
        image: config.StaticFileBaseUrl + '/Workers/image/location.png',
        // 设置贴地
        heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4),
        heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5),
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
        scale: 1.0,
        scale: 0.3,
      },
    });

    this.setViewerFlyTo(position)
    window.Viewer.flyTo(position, {
      offset: {
        heading: Cesium.Math.toRadians(0.0),
        pitch: Cesium.Math.toRadians(-45),
        range: 40000
      }
    });
  },
  setViewerFlyTo(entity) {

@@ -663,7 +893,7 @@
        positions: Cesium.Cartesian3.fromDegreesArray(position),
        width: 10.0,
        material: new Cesium.PolylineOutlineMaterialProperty({
          color: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4),
          color: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5),
          outlineWidth: 1,
          outlineColor: Cesium.Color.CORNFLOWERBLUE,
        }),
@@ -671,7 +901,14 @@

      },
    })
    this.setViewerFlyTo(polyline)
    window.Viewer.flyTo(locationPolygonEntity, {
      offset: {
        heading: Cesium.Math.toRadians(0.0),
        pitch: Cesium.Math.toRadians(-90),
        range: 0
      }
    }
    );
  }

};