休

src/components/GdMap/index copys.vue

@@ -1,8 +1,7 @@
 <template>
   <div :id="mapid" class="map"></div>
   <div class="changeMap_box" v-if="props.isShow">
-    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
-      style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
+    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
     <!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3"  @change="onMapImageChange">
       <el-carousel-item>
         <div class="mapImageItem">
@@ -75,7 +74,7 @@ const props = defineProps({
 });
 try {
   const userInfo = getItem("deptId")[0].deptCode;
-} catch (error) { }
+} catch (error) {}
 let map;
 let mapLayer;
 let mapLayer1;
@@ -89,33 +88,27 @@ onMounted(() => {
 
   map = new EliMap({
     id: props.mapid,
-    crs: "EPSG:4490",
+    crs: "EPSG:3857",
     style: {
       glyphs: "./fonts/{fontstack}/{range}.pbf",
-      center: [94.36057012, 29.64276831],
-      zoom: 15
+      center: [94.36,29.65],
+      zoom: 10
     },
-    minZoom: 7,
-    maxZoom: 18,
+    transformRequest: (url) => {
+      if (url.indexOf("TileMatrix=") != -1) {
+        const arr = url.split("TileMatrix=");
+        const arr1 = arr[1].split("&");
+        const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
+
+      }
+    }
   });
+
   window.map = map;
   map.mapboxGLMap.on("load", () => {
-    map.addWMTSLayer(
-      "http://89.0.23.24/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
-      ,
-      {
-        Service: "getImage",
-        Type: "RGB",
-        ZoomOffset: "0",
-        V: "0.3",
-        Zoom: "{z}",
-        Row: "{y}",
-        Col: "{x}"
-      },
-      {
-        tileSize: 300
-      }
-    );
+     map.addGaudLayer({
+      url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
+    })
     zoomTarget.value = map.mapboxGLMap.getZoom();
   });
   mapUtil.value = new MapUtil(map);
@@ -173,7 +166,7 @@ onMounted(() => {
   });
   // 回显线
   emitter.on("echoLine", (res) => {
-    mapUtil.value.createLine(res, res.flag);
+    mapUtil.value.createLine(res);
   });
   //创建边界面（geojson）
   emitter.on("setBoundarys", (res) => {
@@ -204,6 +197,11 @@ onMounted(() => {
     mapUtil.value.diffusionCircle(res);
   });
 
+  // 清除全部覆盖物
+  emitter.on("removeElementAll", () => {
+    mapUtil.value.removeElementAll();
+  });
+
   // 展示盘曲
   emitter.on("showGapText", (obj) => {
     mapUtil.value.gapText(obj);
@@ -302,6 +300,7 @@ onUnmounted(() => {
   emitter.off("diffusionCircle");
   emitter.off("SsCircle");
   emitter.off("ClearssCircle");
+  emitter.off("removeElementAll");
 });
 </script>
 
@@ -324,35 +323,29 @@ onUnmounted(() => {
   right: 398px;
   bottom: 4px;
   z-index: 9;
-
   .mapImageItem {
     border: 1px solid #08aae8;
     background: rgb(9, 26, 70);
-
-    &>img {
+    & > img {
       width: 100%;
       height: 50px;
     }
-
-    &>div {
+    & > div {
       text-align: center;
       position: relative;
       top: -3px;
     }
   }
-
   .zoomTargetBox {
     margin-top: 10px;
     margin-left: 23px;
   }
-
   ::v-deep .el-input-number__decrease,
   ::v-deep .el-input-number__increase {
     background: #133362;
     color: #fff;
     border: none;
   }
-
   ::v-deep .el-input__inner {
     background: #0c1641;
   }

src/components/GdMap/index.vue

@@ -1,7 +1,8 @@
 <template>
   <div :id="mapid" class="map"></div>
   <div class="changeMap_box" v-if="props.isShow">
-    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
+    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
+      style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
     <!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3"  @change="onMapImageChange">
       <el-carousel-item>
         <div class="mapImageItem">
@@ -74,7 +75,7 @@ const props = defineProps({
 });
 try {
   const userInfo = getItem("deptId")[0].deptCode;
-} catch (error) {}
+} catch (error) { }
 let map;
 let mapLayer;
 let mapLayer1;
@@ -88,27 +89,33 @@ onMounted(() => {
 
   map = new EliMap({
     id: props.mapid,
-    crs: "EPSG:3857",
+    crs: "EPSG:4490",
     style: {
       glyphs: "./fonts/{fontstack}/{range}.pbf",
-      center: [94.36,29.65],
-      zoom: 10
+      center: [94.36057012, 29.64276831],
+      zoom: 15
     },
-    transformRequest: (url) => {
-      if (url.indexOf("TileMatrix=") != -1) {
-        const arr = url.split("TileMatrix=");
-        const arr1 = arr[1].split("&");
-        const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
-
-      }
-    }
+    minZoom: 7,
+    maxZoom: 18,
   });
-
   window.map = map;
   map.mapboxGLMap.on("load", () => {
-     map.addGaudLayer({
-      url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
-    })
+    map.addWMTSLayer(
+      "http://89.0.23.24/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
+      ,
+      {
+        Service: "getImage",
+        Type: "RGB",
+        ZoomOffset: "0",
+        V: "0.3",
+        Zoom: "{z}",
+        Row: "{y}",
+        Col: "{x}"
+      },
+      {
+        tileSize: 300
+      }
+    );
     zoomTarget.value = map.mapboxGLMap.getZoom();
   });
   mapUtil.value = new MapUtil(map);
@@ -166,7 +173,7 @@ onMounted(() => {
   });
   // 回显线
   emitter.on("echoLine", (res) => {
-    mapUtil.value.createLine(res);
+    mapUtil.value.createLine(res, res.flag);
   });
   //创建边界面（geojson）
   emitter.on("setBoundarys", (res) => {
@@ -197,11 +204,6 @@ onMounted(() => {
     mapUtil.value.diffusionCircle(res);
   });
 
-  // 清除全部覆盖物
-  emitter.on("removeElementAll", () => {
-    mapUtil.value.removeElementAll();
-  });
-
   // 展示盘曲
   emitter.on("showGapText", (obj) => {
     mapUtil.value.gapText(obj);
@@ -300,7 +302,6 @@ onUnmounted(() => {
   emitter.off("diffusionCircle");
   emitter.off("SsCircle");
   emitter.off("ClearssCircle");
-  emitter.off("removeElementAll");
 });
 </script>
 
@@ -323,29 +324,35 @@ onUnmounted(() => {
   right: 398px;
   bottom: 4px;
   z-index: 9;
+
   .mapImageItem {
     border: 1px solid #08aae8;
     background: rgb(9, 26, 70);
-    & > img {
+
+    &>img {
       width: 100%;
       height: 50px;
     }
-    & > div {
+
+    &>div {
       text-align: center;
       position: relative;
       top: -3px;
     }
   }
+
   .zoomTargetBox {
     margin-top: 10px;
     margin-left: 23px;
   }
+
   ::v-deep .el-input-number__decrease,
   ::v-deep .el-input-number__increase {
     background: #133362;
     color: #fff;
     border: none;
   }
+
   ::v-deep .el-input__inner {
     background: #0c1641;
   }

ylth/index.html

@@ -0,0 +1,9 @@
+<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" name="viewport"><link rel="icon" href="favicon.ico"><title>公安</title><script src="./pgis/eliMapboxgl.min.js"></script><script src="./static/js/vconsole.min.js"></script><script src="./static/js/jquery-1.12.4.min.js"></script><script src="./static/js/moment.js"></script><script src="./static/js/vue.js"></script><script src="./static/js/antd.min.js"></script><script src="./static/js/antd-with-locales.min.js"></script><link href="static/css/chunk-0d5574ef.32b18482.css" rel="prefetch"><link href="static/css/chunk-0fdaaf92.0c8b1149.css" rel="prefetch"><link href="static/css/chunk-15d0e086.f2ed914b.css" rel="prefetch"><link href="static/css/chunk-19815cd9.fe934a3e.css" rel="prefetch"><link href="static/css/chunk-1b25b3a0.dbb2cfef.css" rel="prefetch"><link href="static/css/chunk-28bd6e9c.0577588b.css" rel="prefetch"><link href="static/css/chunk-2cc5efda.ce890925.css" rel="prefetch"><link href="static/css/chunk-3596bc08.4d6490f8.css" rel="prefetch"><link href="static/css/chunk-418af005.a9f08a65.css" rel="prefetch"><link href="static/css/chunk-455e0e48.6da1c4d0.css" rel="prefetch"><link href="static/css/chunk-48f37632.96c16873.css" rel="prefetch"><link href="static/css/chunk-548a1330.cad1653e.css" rel="prefetch"><link href="static/css/chunk-608198a8.630e98f6.css" rel="prefetch"><link href="static/css/chunk-61c2abd0.3c058eb8.css" rel="prefetch"><link href="static/css/chunk-8b575eb6.61a130d5.css" rel="prefetch"><link href="static/css/chunk-a37f0b78.9266fafe.css" rel="prefetch"><link href="static/css/chunk-e8303676.55ea4f8a.css" rel="prefetch"><link href="static/css/chunk-e94c1e5c.c3628cd2.css" rel="prefetch"><link href="static/css/chunk-fc70b89e.d9cdf86b.css" rel="prefetch"><link href="static/css/chunk-fe6900ae.50f8e44f.css" rel="prefetch"><link href="static/js/chunk-0d5574ef.a336004f.js" rel="prefetch"><link href="static/js/chunk-0fdaaf92.96513d67.js" rel="prefetch"><link href="static/js/chunk-15d0e086.e35a849a.js" rel="prefetch"><link href="static/js/chunk-19815cd9.831d7c4e.js" rel="prefetch"><link href="static/js/chunk-1b25b3a0.083a0498.js" rel="prefetch"><link href="static/js/chunk-28bd6e9c.f97fa2ad.js" rel="prefetch"><link href="static/js/chunk-2cc5efda.83536ac7.js" rel="prefetch"><link href="static/js/chunk-3596bc08.64d195aa.js" rel="prefetch"><link href="static/js/chunk-418af005.6aa3b814.js" rel="prefetch"><link href="static/js/chunk-455e0e48.cbe4ca2e.js" rel="prefetch"><link href="static/js/chunk-48f37632.3879b85f.js" rel="prefetch"><link href="static/js/chunk-548a1330.f50e10a5.js" rel="prefetch"><link href="static/js/chunk-608198a8.5db1d4c5.js" rel="prefetch"><link href="static/js/chunk-61c2abd0.2a77232d.js" rel="prefetch"><link href="static/js/chunk-8b575eb6.a4230b28.js" rel="prefetch"><link href="static/js/chunk-a37f0b78.7cc40bee.js" rel="prefetch"><link href="static/js/chunk-e8303676.1430377e.js" rel="prefetch"><link href="static/js/chunk-e94c1e5c.6ad1f39e.js" rel="prefetch"><link href="static/js/chunk-fc70b89e.46304eea.js" rel="prefetch"><link href="static/js/chunk-fe6900ae.95533d2a.js" rel="prefetch"><link href="static/css/app.edda9e63.css" rel="preload" as="style"><link href="static/css/chunk-vendors.ccb705f1.css" rel="preload" as="style"><link href="static/js/app.0f168338.js" rel="preload" as="script"><link href="static/js/chunk-vendors.62ab2f07.js" rel="preload" as="script"><link href="static/css/chunk-vendors.ccb705f1.css" rel="stylesheet"><link href="static/css/app.edda9e63.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but 公安 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script>document.documentElement.addEventListener(
+      "touchmove",
+      function (event) {
+        if (event.touches.length > 1) {
+          event.preventDefault();
+        }
+      },
+      false
+    );</script><script src="static/js/chunk-vendors.62ab2f07.js"></script><script src="static/js/app.0f168338.js"></script></body></html>