+注释

liuyg

2022-03-31 e8ed1c487ea1f9bc19694bc60a0328a7fc76134a

 src/components/basemap/mainInThere.vue

@@ -43,31 +43,6 @@
  Rotate,
} from "ol/control.js";

import VectorLayer from "ol/layer/Vector";
import VectorSource from "ol/source/Vector";

import { OSM, TileWMS, Vector } from "ol/source";
// import Draw from "ol/interaction/Draw";
import Draw from "./Draw";

import Feature from "ol/Feature.js";
import Point from "ol/geom/Point.js";
import LineString from "ol/geom/LineString.js";
import { Icon, Style, Fill, Stroke } from "ol/style.js";

// import drawFence from "./drawFence";

import OlFeature from "ol/Feature";
import OlGeomPoint from "ol/geom/Point";
// import OlLayerVector from "ol/layer/Vector";
// import OlSourceVector from "ol/source/Vector";
import OlStyleStyle from "ol/style/Style";
import OlStyleIcon from "ol/style/Icon";
// // 用来添加相关文字描述的
import OlStyleText from "ol/style/Text";
import OlStyleFill from "ol/style/Fill";
// import Cesium from "libs/Cesium/Cesium.js";

export default {
  name: "MapInThere",
  components: {
@@ -75,82 +50,14 @@
  },
  data() {
    return {
      // gunAddlayer: new VectorLayer({
      //   // 图标图层
      //   zIndex: 22,
      //   source: new VectorSource(),
      // }),
      // peopleAddlayer: new VectorLayer({
      //   // 图标图层
      //   zIndex: 22,
      //   source: new VectorSource(),
      // }),
      // carAddlayer: new VectorLayer({
      //   // 图标图层
      //   zIndex: 22,
      //   source: new VectorSource(),
      // }),
      // // peopleLineAddlayer: new VectorLayer({
      // //   // 图标图层
      // //   zIndex: 22,
      // //   source: new VectorSource(),
      // // }),
      // beginsPoint: new VectorLayer({
      //   // 图标图层
      //   zIndex: 22,
      //   source: new VectorSource(),
      // }),
      // DrawLayer: new VectorLayer({
      //   // 图标图层
      //   // zIndex: 1000,
      //   source: new VectorSource(),
      // }),
      toMoveTime: null,
      oldService: "",
      mapService: [
        // {
        //   id: "",
        //   value: "",
        // show:''
        // },
      ],
      mapService: [],
    };
  },
  // computed: {
  //   mapServiceSee() {
  //   },
  // },
  // watch: {
  //   // openDrawChiose() {
  //   //   console.log(this.openDrawChiose, "openDrawChiose");
  //   // },
  //   mapServiceValue: {
  //     handler(val) {
  //       // console.log("深度监听：", val);
  //       // this.checkDom("getMapDataRefs", (dom) => {
  //       //   dom.setServiceData(this.mapServiceValue);
  //       // });
  //     },
  //     deep: true,
  //   },
  // },
  mounted() {
    const ol2d = new OlMap({
      layers: [
        // new OlLayerTile({
        //   zIndex: 4,
        //   title: "影像",
        //   source: new XYZ({
        //     url: "https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal", // 行政区划
        //   }),
        // }),
        // new OlLayerTile({
        //   zIndex: 5,
        //   title: "道路+中文注记",
        //   source: new XYZ({
        //     url: "http://t3.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0", // 注记
        //   }),
        // }),
        new OlLayerTile({
          zIndex: 4,
          title: "矢量",
@@ -192,17 +99,10 @@
    window.ol2d = ol2d;

    var view = ol2d.getView();

    // let provider = new Cesium.UrlTemplateImageryProvider({
    //   url: "/wp/{z}/{x}/{y}.png",
    //   fileExtension: "png",
    // });
    // view.imageryLayers.addImageryProvider(provider);

    // view.setCenter([115.85883507433789, 28.708432053474827])
    //设置中心点
    view.setCenter([114.03858862, 27.63088262]);

    //
    //缩放范围
    view.setZoom(18);
    this.view = view;
    // const ol3d = new OLCesium({ map: window.ol2d });
@@ -216,6 +116,7 @@
  },
  methods: {
    clearServiceData() {
      //清空
      this.mapService = [];
    },
    setServiceData(data) {
@@ -257,18 +158,6 @@
          }),
          // }),
        });
        // console.log(data[data.length - 1].service);
        // console.log(that.oldService);
        // let str = "";
        // for (let k in that.oldService) {
        //   if (that.oldService[k] != data[data.length - 1].service[k]) {
        //     // console.log(that.oldService[k]);
        //     // console.log(data[data.length - 1].service[k]);
        //     str += that.oldService[k];
        //   }
        // }
        // console.log("str", str);
        // that.view.setCenter(layer);
        let doit = () => {
          this.toMoveTime = setTimeout(() => {
            console.log(window.ol2d);
@@ -311,30 +200,7 @@
          that.mapService.splice(that.$store.state.map.deleteIndex, 1);
        }
      }
      // console.log(this.mapService);
      // for()
    },
    // addMapService(data) {
    //   let layer = new OlLayerTile({
    //     // source: new XYZ({
    //     //   url: "http://mt3.google.cn/vt/lyrs=t&hl=zh-CN&gl=CN&src=app&x={x}&y={y}&z={z}&s=Ga",
    //     // }),
    //     // new OlLayerTile({
    //     zIndex: 5,
    //     title: "中文注记",
    //     source: new XYZ({
    //       url: "http://t3.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0", // 注记
    //     }),
    //     // }),
    //   });
    //   this.mapService.push({
    //     layer: layer,
    //   });
    //   window.ol2d.addLayer(layer);
    //   setTimeout(() => {
    //     window.ol2d.removeLayer(layer);
    //   }, 2000);
    // },
  },
};
</script>