feat: 修改 mapOfTongren 位置

src/views/page1/index.vue

@@ -74,7 +74,7 @@
 </template>
 
 <script>
-import mapOfTongren from './mapOfTongren.json'
+import mapOfTongren from '@/http/mapOfTongren.json'
 import bgBox from '@/components/bgBox/index.vue'
 import { screenSize } from '@/assets/js/utils'
 import cake from '@/components/Customize/cake'

src/views/page2/cmap.vue

@@ -1,11 +1,13 @@
 <template>
   <div>
+    <div ref="testx">一些测试</div>
     <div id="container" class="g-bg1"></div>
   </div>
 </template>
 
 <script>
 import AMapLoader from '@amap/amap-jsapi-loader'
+import mapOfTongren from '@/http/mapOfTongren.json'
 
 window.map = {}
 
@@ -24,7 +26,6 @@ export default {
   },
   methods: {
     async initAMap() {
-      const json = await this.$http.get(`/api/mapOfTongren`)
       window._AMapSecurityConfig = {
         securityJsCode: `a2017cdc059be6c03b430a3185098003`,
       }
@@ -34,11 +35,16 @@ export default {
         plugins: [`AMap.Scale`], // 需要使用的的插件列表，如比例尺'AMap.Scale'，支持添加多个如：['...','...']
       })
         .then((AMap) => {
-          let content = [
-            `<div class='info_box_contant'> ` + `vo.aname` + ` </div>`,
-          ]
           function addPolygon(data) {
             const { name, center } = data.properties
+            let content = [
+              `<div class='info_box_contant'> ` + name + ` </div>`,
+            ]
+            const infoWindow = new AMap.InfoWindow({
+              isCustom: true, // 使用自定义窗体
+              content: content.join(`<br>`),
+              offset: new AMap.Pixel(0, -25),
+            })
             const path = data.geometry.coordinates
             let polygon = new AMap.Polygon({
               path: path,
@@ -53,14 +59,20 @@ export default {
               lineCap: `round`,
             })
             polygon.on(`mouseover`, (e) => {
-              console.log(`mouseover`)
               // 如果缩放过大还变色, 万一人家是想看放大后的详细地点, 变色后反而不方便
               if (window.map.getZoom() <= 11) {
-                content = [` <div class='info_box_contant'>222</div>`]
-                infoWindow._originOpts.content = content.join(`</br>`)
-                console.log(infoWindow._originOpts, `2222222222`)
-                // infoWindow.open(window.map, [e.lnglat.lng, e.lnglat.lat]) // 后面的参数指的是经纬度，在此显示窗口
-                infoWindow.open(window.map, center) // 后面的参数指的是经纬度，在此显示窗口
+                infoWindow.open(window.map, center)
+                $(`.info_box_contant`).on({
+                  mouseover() {
+                    console.log(`mouseover`)
+                    infoWindow.open(window.map, center)
+                    $(`.info_box_contant`).show()
+                  },
+                  mouseleave() {
+                    console.log(`mouseleave`)
+                    $(`.info_box_contant`).hide()
+                  },
+                })
                 polygon.setOptions({
                   fillOpacity: 0.7,
                   fillColor: `#7bccc4`,
@@ -75,15 +87,10 @@ export default {
                 fillOpacity: 0,
                 fillColor: `#ccebc5`,
               })
-              infoWindow.close()
+              // infoWindow.close()
             })
             window.map.add(polygon)
           }
-          const infoWindow = new AMap.InfoWindow({
-            isCustom: true, // 使用自定义窗体
-            content: content.join(`<br>`),
-            offset: new AMap.Pixel(0, -25),
-          })
           window.map = new AMap.Map(`container`, {
             // resizeEnable: true,
             // 设置地图容器id
@@ -125,7 +132,7 @@ export default {
             // zooms: [16, 20],
           })
           window.map.setFeatures([`point`]) // 单一种类要素显示
-          let list = json.features.map((item) => item)
+          let list = mapOfTongren.features.map((item) => item)
           list.forEach((item) => {
             addPolygon(item)
           })