修改地图

src/views/visualization/components/Map.vue

@@ -53,6 +53,8 @@
       const mapJSON = ref()
       const tempMapJSON = ref()
 
+      let options: any = null
+
       const { rootEmitter } = useVContext()
 
       const baseData = ref([])
@@ -85,12 +87,14 @@
           })
         })
         registerMap('lcxz', tempMapJSON.value)
-
-        setOptions({
+        options = {
           backgroundColor: 'transparent',
           stateAnimation: {
             duration: 100,
           },
+          // tooltip: {
+          //   trigger: 'item',
+          // },
           geo: {
             map: 'lcxz',
             aspectScale: 0.75,
@@ -233,7 +237,8 @@
               type: 'scatter',
               coordinateSystem: 'geo',
               tooltip: {
-                show: false,
+                trigger: 'item',
+                show: true,
               },
               symbol: (_, params) => {
                 return mapData[params.dataIndex].img
@@ -246,10 +251,10 @@
             {
               type: 'scatter',
               coordinateSystem: 'geo',
-              stateAnimation: {
-                duration: 300,
-                easing: 'bounceOut',
-              },
+              // stateAnimation: {
+              //   duration: 300,
+              //   easing: 'bounceOut',
+              // },
               label: {
                 show: true,
                 align: 'center',
@@ -284,10 +289,12 @@
               symbolSize: [100, 34],
               symbolOffset: [0, -46],
               z: 999,
-              data: mapData,
+              // data: mapData,
+              data: [],
             },
           ],
-        })
+        }
+        setOptions(options)
       }
 
       async function getBase() {
@@ -315,9 +322,35 @@
         tempMapJSON.value = deepMerge(mapJSON.value)
         getBase()
       }
+
+      let tempName: any = null
       onMounted(async () => {
         await getData()
+        getInstance()?.on('mousemove', (e) => {
+          // const arr = options.series[3].data
+          // if (e.seriesType == 'map' && arr.length) {
+          //   console.log('=====清除')
+          //   options.series[3].data = []
+          //   getInstance()?.setOption({ series: options.series }, false)
+          // }
 
+          if (tempName == e.name && e.seriesType == 'scatter') return
+          if (e.seriesType == 'scatter') {
+            tempName = e.name
+            options.series[3].data = [e.data]
+            getInstance()?.setOption({ series: options.series }, false)
+          }
+
+          // if (tempName == e.name) return
+          // tempName = e.name
+          // if (e.componentSubType == 'scatter') {
+          //   options.series[3].data = [e.data]
+          //   getInstance()?.setOption({ series: options.series }, false)
+          // } else {
+          //   options.series[3].data = [e.data]
+          //   getInstance()?.setOption({ series: options.series }, false)
+          // }
+        })
         getInstance()?.on('click', (e) => {
           if (e.seriesType == 'effectScatter' || e.seriesType == 'scatter') {
             rootEmitter.emit('base:click', e.data)