趋势图柱状宽度等功能修改

src/views/atmosphere/acid-rain/trend/index.vue

@@ -256,23 +256,31 @@ export default {
         yAxis: this.trendData.yAxis,
         series: this.trendData.series
       };
-      //添加一个新的刻度线 实现折线在柱状图的中间显示
+      let barArray = option.series.filter(item => item.type === 'bar')
-      // option.xAxis[1] = {
+      if (barArray && barArray.length <= 6) {
-      //   type: 'value',
+        barArray.forEach(item => {
-      //   max: option.xAxis[0].data.length,
+          item.barWidth = 80
-      //   show: false
+          if (barArray.length === 1) {
-      // };
+            item.itemStyle = { color: '#9fe080' }
-
+          }
+        })
+      }
       let lineArray = option.series.filter(item => item.type === 'line');
       lineArray.forEach((item, index) => {
-        // item.xAxisIndex = 1;
+        console.log("item", item);
         item.lineStyle = {
-          type: 'dashed'
+          type: 'dashed',
         };
+        if (lineArray.length === 2) {
+          if (index === 0) {
+            item.lineStyle.color = '#e8cd6a'
+          } else {
+            item.lineStyle.color = '#5c7bd9'
+          }
+        }
         if (index === 0) {
           item.label.offset = [20,30]
         }
-        // item.data = item.data.map((x, i) => [i + (1 / (option.legend.data.length + 1)) * (index + 1), x]);
       });
       console.log('option', option);
       trendChart.setOption(option);

src/views/atmosphere/air/trend/index.vue

@@ -371,7 +371,16 @@ export default {
         max: option.xAxis[0].data.length,
         show: false
       };
-
+      let barArray = option.series.filter(item => item.type === 'bar')
+      console.log("barArray", barArray);
+      if (barArray && barArray.length <= 6) {
+        barArray.forEach(item => {
+          item.barWidth = 80
+          if (barArray.length === 1) {
+            item.itemStyle = { color: '#9fe080' }
+          }
+        })
+      }
       let lineArray = option.series.filter(item => item.type === 'line');
       lineArray.forEach((item, index) => {
         item.xAxisIndex = 1;

src/views/sound/function/trend/index.vue

@@ -278,6 +278,15 @@
           yAxis: this.trendData.yAxis,
           series: this.trendData.series
         }
+        let barArray = option.series.filter(item => item.type === 'bar')
+        if (barArray && barArray.length <= 6) {
+          barArray.forEach(item => {
+            item.barWidth = 80
+            if (barArray.length === 1) {
+              item.itemStyle = { color: '#9fe080' }
+            }
+          })
+        }
         trendChart.setOption(option)
       }
     }

src/views/sound/road/trend/index.vue

@@ -245,7 +245,16 @@
           max: option.xAxis[0].data.length,
           show: false
         }
-
+        // 设置bar宽度
+        let barArray = option.series.filter(item => item.type === 'bar')
+        if (barArray && barArray.length <= 6) {
+          barArray.forEach(item => {
+            item.barWidth = 80
+            if (barArray.length === 1) {
+              item.itemStyle = { color: '#9fe080' }
+            }
+          })
+        }
         let lineArray = option.series.filter(item => item.type === 'line')
         lineArray.forEach((item,index) => {
           item.xAxisIndex = 1

src/views/sound/zone/trend/index.vue

@@ -223,6 +223,15 @@
           yAxis: this.trendData.yAxis,
           series: this.trendData.series
         }
+        let barArray = option.series.filter(item => item.type === 'bar')
+        if (barArray && barArray.length <= 6) {
+          barArray.forEach(item => {
+            item.barWidth = 80
+            if (barArray.length === 1) {
+              item.itemStyle = { color: '#9fe080' }
+            }
+          })
+        }
         trendChart.setOption(option)
       }
     }