gx

src/view/dialog/dialogMap.vue

@@ -11,11 +11,7 @@
     >
       <template #header="{ close, titleId, titleClass }">
         <div class="my-header">
-          <el-icon
-            size="26"
-            color="#fff"
-            @click="closeDialog"
-          >
+          <el-icon size="26" color="#fff" @click="closeDialog">
             <CircleCloseFilled />
           </el-icon>
         </div>
@@ -45,8 +41,14 @@
           </div>
         </div>
         <div style="width: 100%; height: 600px">
-         <Map style="width:100%;height:100%;" v-if="data.title=='交通'" :center="[119.178783, 29.034583]"></Map>
-         <Map2 style="width:100%;height:100%;" v-if="data.title=='养老机构'" :center="[119.116203, 29.078722]"></Map2>
+          <Map
+            style="width: 100%; height: 100%"
+            v-if="data.showJt"
+          ></Map>
+          <Map2
+            style="width: 100%; height: 100%"
+            v-if="data.showYl"
+          ></Map2>
         </div>
       </div>
     </el-dialog>
@@ -85,9 +87,8 @@ const emit = defineEmits(["close"]);
 const dialogShowMap = ref();
 const data = reactive({
   title: "",
-  list1: [],
-  list2: [],
-  year: [],
+  showJt: false,
+  showYl: false,
   option: {},
   bg: [],
 });
@@ -97,12 +98,31 @@ watch(
   () => props.dialogShowMap,
   (newVal, oldVal) => {
     dialogShowMap.value = newVal;
+    if (data.title == "交通") {
+      console.log(1111111111);
+      setTimeout(() => {
+        data.showJt = true;
+      }, 1000);
+    } else {
+      setTimeout(() => {
+        data.showYl = true;
+      }, 1000);
+    }
   }
 );
 watch(
   () => props.title,
   (newVal, oldVal) => {
     data.title = newVal;
+    if (newVal == "交通") {
+      setTimeout(() => {
+        data.showJt = true;
+      }, 1000);
+    } else {
+      setTimeout(() => {
+        data.showYl = true;
+      }, 1000);
+    }
   }
 );
 // 使用生命钩子
@@ -112,9 +132,10 @@ onMounted(() => {
 
 const closeDialog = () => {
   dialogShowMap.value = false;
+  data.showJt = false;
+  data.showYl = false;
   emit("close");
 };
-
 </script>
 <style lang="scss" scoped>
 :deep(.el-dialog) {

src/view/dialog/echarts/map.vue

@@ -7,14 +7,7 @@ import { onMounted, reactive, nextTick, ref, defineProps, watch } from "vue";
 // import mapTown from '@/assets/json/330225.json'
 import m1 from "@/assets/images/map/m1.png";
 import m2 from "@/assets/images/map/m2.png";
-const props = defineProps({
-  center: {
-    type: Array,
-    default: () => {
-      return [119.116203, 29.078722];
-    },
-  },
-});
+
 let map = null;
 // 点位
 const mapTownCount = reactive([
@@ -103,7 +96,7 @@ const initMap = () => {
     styleId: "d0acde891abd157741b71e12670ee2e6",
   });
 
-  goMapCenter(props.center, 12);
+  goMapCenter([119.116203, 29.078722], 12);
   loadTown();
   addPolygonCounty();
 };
@@ -239,12 +232,6 @@ const createCustomOverlay = (polygon) => {
   });
   map.addOverlay(customOverlay);
 };
-watch(
-  () => props.center,
-  (newVal) => {
-    goMapCenter(newVal, 12);
-  }
-);
 onMounted(() => {
   initMap();
 });

src/view/echart_analyze/map.vue

@@ -12,14 +12,6 @@ import {
   defineProps,
   watch,
 } from "vue";
-const props = defineProps({
-  center: {
-    type: Array,
-    default: () => {
-      return [119.178783, 29.034583];
-    },
-  },
-});
 var map = null;
 const initMap = () => {
   map = new BMapGL.Map("map", { minZoom: 11, maxZoom: 20 });
@@ -27,22 +19,14 @@ const initMap = () => {
   map.setMapStyleV2({
     styleId: "d0acde891abd157741b71e12670ee2e6",
   });
-  goMapCenter(props.center, 15);
+  goMapCenter([119.178783, 29.034583], 15);
 };
 
 //地图中点
 const goMapCenter = (point, zoom) => {
   map.centerAndZoom(new BMapGL.Point(point[0], point[1]), zoom);
 };
-watch(
-  () => props.center,
-  (newVal) => {
-    console.log(newVal);
-    goMapCenter(newVal, 15);
-  }
-);
 onMounted(() => {
-  
   initMap();
 });
 </script>