农场地图展示完善

Administrator

2022-05-11 bcb0b5f05984af58e329404ec8e7b3862878515f

 src/components/map/mainInThere.vue

@@ -22,25 +22,6 @@
  // eslint-disable-next-line no-unused-vars
  defaults as OlControlDefaults,
  defaults,
  // 全屏控件
  FullScreen,
  // 比例尺控件
  ScaleLine,
  // 缩放滚动条控件
  // eslint-disable-next-line no-unused-vars
  ZoomSlider,
  // 鼠标位置控件
  // eslint-disable-next-line no-unused-vars
  MousePosition,
  // -地图属性控件
  Attribution,
  // 鹰眼控件
  // eslint-disable-next-line no-unused-vars
  OverviewMap,
  // 缩放到范围控件
  // eslint-disable-next-line no-unused-vars
  ZoomToExtent,
  Rotate
} from "ol/control.js";

import VectorLayer from "ol/layer/Vector";
@@ -81,11 +62,6 @@
        zIndex: 22,
        source: new VectorSource()
      }),
      // peopleLineAddlayer: new VectorLayer({
      //   // 图标图层
      //   zIndex: 22,
      //   source: new VectorSource(),
      // }),
      beginsPoint: new VectorLayer({
        // 图标图层
        zIndex: 22,
@@ -97,14 +73,6 @@
        source: new VectorSource()
      }),
      peopleLineAddlayer: null,

      // 存储新增点，线，面，数据的地方
      // polygonData: [],
      // polygonFlag: false,
      // editToolbar: null,
      // addPolygonEntitys: null,

      // typeSelected: "LineString",
      typeSelected: "Polygon",
      // drawLayer: null,
      draw: null,
@@ -150,12 +118,6 @@
  },
  computed: {
    openDrawChiose() {
      // console.log(
      //   "this.openDrawLine:",
      //   this.openDrawLine,
      //   "this.openDrawPoint:",
      //   this.openDrawPoint
      // );
      if (this.openDrawLine) {
        return "openDrawLine";
      } else if (this.openDrawPoint) {
@@ -249,7 +211,6 @@
      });
      ol2d.addInteraction(this.draw);
      this.draw.on("drawend", function(evt) {
        // console.log(evt, 3);
        that.drawingEnd(evt);
      });
    },
@@ -265,7 +226,7 @@
        points[0].map(item => {
          that.polygon.push({ lng: item[0], lat: item[1] });
        });
        // console.log(that.polygon, 1111);
        
        that.$store.commit("setpolygon", that.polygon); //用vuex传最终数据
        //重新画面
        that.addLines(that.polygon, "mian");
@@ -282,7 +243,6 @@
    },
    onceOnlodad(ourDatas) {
      this.ourDatas = ourDatas;
      console.log(ourDatas);
    },
    //old
    //加载底层路线和图标
@@ -307,8 +267,6 @@
    },
    // 若没有value数据，删除地图上的元素
    deleteElement(name, id) {
      // console.log(name, id);
      // this.ourLayer[name + id].getSource().clear();
      for (let k in this.ourLayer) {
        this.ourLayer[k].getSource().clear();
      }
@@ -363,15 +321,12 @@
      var entityArr = [];
      if (notdo) {
        entityArr = data;
        console.log(entityArr, "notdo");
      } else {
        for (let kd in data) {
          entityArr.push([Number(data[kd].lng), Number(data[kd].lat)]);
        }
      }
      // console.log(entityArr);
      var lineCoords = entityArr; // 线里点的集合
      // console.log(lineCoords);
      var feature_LineString = new Feature({
        //线面板
        geometry: new LineString(lineCoords)
@@ -395,8 +350,6 @@
      //面
      //解析面数据
      let mianData = [lineCoords];
      // console.log(mianData);
      // return;
      var feature_Polygon = new Feature({
        //面面板
        geometry: new Polygon(mianData)
@@ -418,7 +371,6 @@
      this.layermian.getSource().addFeature(feature_Polygon);
      //保存图层
      ol2d.addLayer(this.layermian);
      // console.log(this.ourLayer, 88888);
    },

    //上面是初始化·················
@@ -433,10 +385,8 @@
      }
      this.nowIndex = num;
      if (val.indexOf("路径") != -1) {
        // console.log("加载路径按钮");
        this.controlBut("openDrawLine", this.notNow);
      } else {
        // console.log("加载标点按钮");
        this.controlBut("openDrawPoint", this.notNow);
      }
    },
@@ -468,7 +418,6 @@
    //确认数据
    useMapData() {
      //返回用数据
      // console.log(this.openDrawChiose, this.nowIndex);
      this.$parent.MapDataShow = false;
      let val;
      if (this.openDrawChiose == "openDrawLine") {
@@ -587,13 +536,6 @@
      }

      var lineCoords = entityArr; // 线里点的集合
      //移动位置---暂不需要
      // var view = ol2d.getView();
      // view.setCenter([
      //   lineCoords[Math.ceil(entityArr.length / 2)][0],
      //   lineCoords[Math.ceil(entityArr.length / 2)][1],
      // ]);
      // view.setZoom(14.5);

      // 要素
      var feature_LineString = new Feature({