gx

src/view/sy_map.vue

@@ -111,6 +111,7 @@ import j9 from "@/assets/images/map/j9.png";
 import j10 from "@/assets/images/map/j10.png";
 import m1 from "@/assets/images/map/m1.png";
 import m2 from "@/assets/images/map/m2.png";
+import dwd from "@/assets/images/map/dwd.png";
 //地图设置
 //默认龙游县灰色地块
 const mapTownDataDK = reactive([]);
@@ -161,6 +162,10 @@ const addPolygonCounty = () => {
         fillColor: fillColor,
         fillOpacity: 0.7,
         name: item.name,
+        flag: "v",
+      });
+      polygon.addEventListener("click", () => {
+        console.log(1111111);
       });
       map.addOverlay(polygon);
     }
@@ -185,8 +190,7 @@ const createCustomOverlay = (polygon) => {
     div.style.display = "flex";
     div.style.justifyContent = "center";
     div.style.alignItems = "center";
-    div.style.background =
-      "url(/src/assets/images/map/b1.png) no-repeat 0/100% 100%";
+    div.style.background = polygon.bgColor;
     div.style.cursor = "pointer";
     div.setAttribute("name", this.properties.title);
 
@@ -198,10 +202,9 @@ const createCustomOverlay = (polygon) => {
     div.appendChild(title);
     title.appendChild(document.createTextNode(this.properties.title));
 
-
-
     let img2 = document.createElement("img");
-    img2.style.width = "60px";
+    img2.style.width = "20px";
+    img2.style.height = "20px";
     img2.src = this.properties.imgSrc2;
 
     content.appendChild(div);
@@ -222,7 +225,7 @@ const createCustomOverlay = (polygon) => {
     offsetY: -10,
     properties: {
       title: polygon.name,
-      imgSrc2: m2,
+      imgSrc2: dwd,
       type: "customOverlay",
     },
   });
@@ -438,78 +441,97 @@ const jbfwqTotal = ref([
           {
             name: "溪口幼儿园",
             point: [119.1856806, 28.8509359],
+            bgColor: "#00b050",
           },
           {
             name: "衢州学院附属幼儿园",
             point: [119.182056, 28.8566857],
+            bgColor: "#00b050",
           },
           {
             name: "溪口中银小学",
             point: [119.1845353, 28.8584533],
+            bgColor: "#00b050",
           },
           {
             name: "溪口初中",
             point: [119.180978, 28.8525691],
+            bgColor: "#00b050",
           },
           {
             name: "居家养老中心",
             point: [119.186287, 28.8491049],
+            bgColor: "#f4c243",
           },
           {
             name: "共享食堂",
             point: [119.184706, 28.8563179],
+            bgColor: "#f4c243",
           },
           {
             name: "老年活动中心",
             point: [119.1839065, 28.8566106],
+            bgColor: "#f4c243",
           },
           {
             name: "残疾人之家",
             point: [119.1862825, 28.8491207],
+            bgColor: "#f4c243",
           },
           {
             name: "智慧篮球场",
             point: [119.1839873, 28.8560886],
+            bgColor: "#00b0f0",
           },
           {
             name: "慢行步道",
             point: [119.1843107, 28.8510743],
+            bgColor: "#00b0f0",
           },
           {
             name: "文化礼堂",
             point: [119.1845532, 28.8562072],
+            bgColor: "#a1ce63",
           },
           {
             name: "综合文化站",
             point: [119.1845982, 28.8482348],
+            bgColor: "#a1ce63",
           },
           {
             name: "共享菜园",
             point: [119.1834393, 28.8559858],
+            bgColor: "#a1ce63",
           },
           {
             name: "零工市场",
             point: [119.1811487, 28.8614348],
+            bgColor: "#a1ce63",
           },
           {
             name: "溪口中心医院",
             point: [119.1839334, 28.8516437],
+            bgColor: "#0070c0",
           },
           {
             name: "溪口菜市场",
             point: [119.1848317, 28.8544673],
+            bgColor: "#184e32",
           },
           {
             name: "大型超市",
             point: [119.1845892, 28.8540481],
+            bgColor: "#184e32",
           },
           {
             name: "智慧停车场",
             point: [119.1865654, 28.8555824],
+            bgColor: "#184e32",
           },
           {
             name: "溪口镇便民服务中心",
             point: [119.1838436, 28.8565473],
+            bgColor: "#184e32",
           },
         ],
       },