站点地图展示，站点地图、单站监控首页部分接口联调

src/views/ems/zddt/BarChart.vue

@@ -5,10 +5,7 @@
 
 <script>
 import * as echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
 import resize from '@/mixins/ems/resize'
-// todo
-// 数据获取、数据格式处理、日期在前端处理还是后端返回
 export default {
   mixins: [resize],
   data() {
@@ -29,9 +26,14 @@ export default {
     this.chart = null
   },
   methods: {
-    initChart() {
-      this.chart = echarts.init(this.$el, 'macarons')
+    setOption(data){
+      console.log('初始化单个站点充、放电量柱状图',data)
+      const source = [['日期','充电量','放电量']]
+      data.forEach(item=>{
+        source.push([item.ammeterDate, item.chargedCap,item.disChargedCap])
+      })
       this.chart.setOption({
+        color:['#A796FF','#FFBE01'],
         legend: {
           left: 'right',
           bottom: '10',
@@ -39,30 +41,27 @@ export default {
         tooltip: {},
         xAxis: { type: 'category' },
         yAxis: { },
-        grid:{top:20},
+        grid:{top:30},
         dataset:{
-          source:[
-            ['product','充电量','放电量'],
-            ['第一天',10,20],
-            ['第二天',20,30],
-            ['第三天',20,30],
-            ['第四天',20,10],
-            ['第五天',200,80],
-            ['第六天',210,300],
-            ['第七天',200,30],
-          ]
+          source
+          // source:[//格式
+          //   ['product','充电量','放电量'],
+          //   ['第一天',10,20],
+          //   ['第二天',20,30],
+          // ]
         },
         series: [
           {
             type: 'bar',//柱状图
-            color:'#A796FF',//柱的颜色
           },
           {
             type: 'bar',//柱状图
-            color:'#FFBE01',//柱的颜色
           }
         ]
       })
+    },
+    initChart() {
+      this.chart = echarts.init(this.$el)
     }
   }
 }