改折线图显示

minggao/src/page/home/newHome/newHome.vue

@@ -3,7 +3,7 @@
  * @Autor: lin
  * @Date: 2024-04-09 14:26:07
  * @LastEditors: lin
- * @LastEditTime: 2024-04-23 17:23:11
+ * @LastEditTime: 2024-04-23 17:36:02
 -->
 <template>
   <div class="box">
@@ -685,14 +685,14 @@ export default {
           stack: type ? type[index] : 'ab',
           name: nameList[index],
         });
-        if(!type) return
-        if(index == 0 || index == 2) {
+        if (!type) return;
+        if (index == 0 || index == 2) {
           series.push({
             data: data,
             type: 'line',
             smooth: true,
             name: nameList[index],
-            color: colorList[index]
+            color: colorList[index],
           });
         }
       });
@@ -762,7 +762,8 @@ export default {
       char.setOption(optionsPestLine);
     },
     // 林木有害生物折线图配置
-    setLineOption(char, xData, yData) {
+    setLineOption(char, xData, yData, type) {
+      char.clear();
       let xDataNew = [];
       xData.forEach((item) => {
         xDataNew.push(item + '月');
@@ -779,19 +780,14 @@ export default {
           containLabel: true,
         },
         legend: {
-          data: [
-            {
-              name: '有害生物数量',
-              textStyle: {
-                color: '#ffffff',
-              },
-            },
-          ],
+          textStyle: {
+            color: '#ffffff',
+          },
         },
         tooltip: {
           trigger: 'axis',
         },
-        color: '#1890FF',
+        color: ['#1890FF', '#F4A72F'],
         xAxis: {
           type: 'category',
           axisLine: {
@@ -828,7 +824,7 @@ export default {
         },
         series: [
           {
-            data: yData,
+            data: yData[0],
             type: 'line',
             smooth: true,
             name: '有害生物数量',
@@ -846,9 +842,30 @@ export default {
               ]),
             },
           },
+          {
+            data: yData[1],
+            type: 'line',
+            smooth: true,
+            name: '有害生物类型',
+            areaStyle: {
+              opacity: 0.8,
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#F4A72F',
+                },
+                {
+                  offset: 1,
+                  color: '#FEE0AE33',
+                },
+              ]),
+            },
+          },
         ],
       }; // 有害生物发生趋势 折线图
-
+      if(type == '杂草') {
+        optionsPestLine.series.length = 1
+      }
       char.setOption(optionsPestLine);
     },
     // 切换有害生物下拉框
@@ -856,7 +873,7 @@ export default {
       this.setLineOption(
         this.pestChart,
         this.pestLineObj[type].month,
-        this.pestLineObj[type].count
+        [this.pestLineObj[type].count,this.pestLineObj[type].category_count], type
       );
     },
     // 获取有害生物列表折线图
@@ -880,7 +897,10 @@ export default {
         this.setLineOption(
           this.pestChart,
           pestLineObj[this.rightLineCategory].month,
-          pestLineObj[this.rightLineCategory].count
+          [
+            pestLineObj[this.rightLineCategory].count,
+            pestLineObj[this.rightLineCategory].category_count,
+          ]
         );
       });
     },