caojunjie 4 年 前
コミット
2bff0944e5
1 ファイル変更49 行追加2 行削除
  1. 49 2
      src/views/index.vue

+ 49 - 2
src/views/index.vue

@@ -98,7 +98,8 @@
     </div>
     <div style="width: 100%;float: left;margin-top:20px;">
       <div style="display: flex;">
-        <div id="box_s" style="width:68%;height:350px;"></div>
+        <div id="box_s" style="width:34%;height:350px;"></div>
+        <div id="box_" style="width:34%;height:350px;"></div>
         <div id="box_ss" style="width:30%;height:350px;margin-left: 20px"></div>
       </div>
     </div>
@@ -188,6 +189,7 @@ export default {
         this.drawLine()
         this.drawLinetwo()
         this.drawLine_ss()
+        this.drawLinetwos()
       })
     },
     query() {
@@ -355,13 +357,58 @@ export default {
         ]
       })
     },
+    drawLinetwos() {
+      // 基于准备好的dom,初始化echarts实例,所以只能在mounted中调用
+      let myChart = this.$echarts.init(document.getElementById('box_'))
+      // 绘制图表
+      myChart.setOption({
+        title: {
+          text: '数据统计',
+          subtext: '实时数据',
+          left: 'center'
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b}: {c} ({d}%)'
+        },
+        legend: {
+          bottom: 10,
+          left: 'center',
+          data: this.name
+        },
+        series: [
+          {
+            name: '访问来源',
+            type: 'pie',
+            radius: ['40%', '60%'],
+            avoidLabelOverlap: false,
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                // show: true,
+                fontSize: '30',
+                fontWeight: 'bold'
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data:
+            this.master
+          }
+        ]
+      })
+    },
     drawLinetwo() {
       // 基于准备好的dom,初始化echarts实例,所以只能在mounted中调用
       let myChart = this.$echarts.init(document.getElementById('box_s'))
       // 绘制图表
       myChart.setOption({
         title: {
-          text: this.chart.whouseList[0].fName + '货权人统计',
+          text: this.chart.whouseList[0].fName + '货权统计',
           subtext: '实时数据',
           left: 'center'
         },