渲染 地图

src/components/echarts/MyEchart.vue

@@ -11,7 +11,7 @@ const chartRef = ref<HTMLDivElement>()
 const props = defineProps(['options'])
 let chart: echarts.ECharts | null = null
 const resizeHandler = () => {
-        chart?.resize()
+    chart?.resize()
 }
 const initChart = () => {
     chart?.dispose()
@@ -19,15 +19,14 @@ const initChart = () => {
     chart = echarts.init(chartRef.value as HTMLDivElement)
     chart.setOption({
         title: {
-            ...props.options.title,
             left: 'center',
             textStyle: {
                 color: '#000',
                 fontSize: 18
-            }
+            },
+            ...props.options.title
         },
         tooltip: {
-            ...(props.options.tooltip || null),
             trigger: 'axis',
 
             axisPointer: {
@@ -44,10 +43,10 @@ const initChart = () => {
                 fontSize: 14
             },
             backgroundColor: 'rgba(0,0,0,0.35)',
-            borderWidth: 0
+            borderWidth: 0,
+            ...(props.options.tooltip || null)
         },
         legend: {
-            ...(props.options.xAxis.legend || null),
             right: 20,
             top: 0,
             itemGap: 10,
@@ -57,7 +56,8 @@ const initChart = () => {
                 padding: [2, 0, 0, 0] //[上、右、下、左]
             },
             itemWidth: 15,
-            itemHeight: 10
+            itemHeight: 10,
+            ...(props.options.legend || null)
         },
 
         grid: {
@@ -65,12 +65,10 @@ const initChart = () => {
             left: '10px',
             right: '40px',
             bottom: '40px',
-
             containLabel: true
         },
         xAxis: [
             {
-                ...(props.options.xAxis || null),
                 type: 'category',
                 axisTick: { show: false },
                 axisLine: {
@@ -84,12 +82,13 @@ const initChart = () => {
                         color: '#000',
                         fontSize: '12'
                     }
-                }
+                },
+                ...(props.options.xAxis || null)
             }
         ],
         yAxis: [
             {
-                ...(props.options.yAxis || null),
+               
                 type: 'value',
 
                 nameTextStyle: {
@@ -113,7 +112,8 @@ const initChart = () => {
                         type: 'dashed',
                         opacity: 0.5
                     }
-                }
+                },
+                ...(props.options.yAxis || null),
             }
         ],
         dataZoom: [