From efb4744f51a973eddf706f67ca272d2d81ad50a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E6=9D=A8?= <1711467488@qq.com>
Date: Sun, 25 Feb 2018 23:12:35 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=9D=E6=AD=A5=E8=A7=A3=E5=86=B3=E4=BA=86?=
 =?UTF-8?q?=E5=A4=9A=E4=B8=AA=E5=9B=BE=E8=A1=A8=E5=90=8C=E6=97=B6=E5=8A=A0?=
 =?UTF-8?q?=E8=BD=BD=E7=9A=84=E6=97=B6=E5=80=99=E5=8D=A1=E9=A1=BF=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: ee84d17720b52073c17a693df68a9cc1a323bf02
Former-commit-id: 63a4854cfc87e8bfa532649f3600663be860145b
Former-commit-id: 648a6ec1f165609655c6f8c3549babb535396851
---
 src/components/charts/G2/mixins/G2.js |  1 +
 src/pages/demo/chart/index/index.vue  | 40 ++++++++++++++++++---------
 2 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/src/components/charts/G2/mixins/G2.js b/src/components/charts/G2/mixins/G2.js
index bd00a5f6..e0147a67 100644
--- a/src/components/charts/G2/mixins/G2.js
+++ b/src/components/charts/G2/mixins/G2.js
@@ -35,6 +35,7 @@ export default {
     if (this.autoInit) {
       this.startInit()
     }
+    this.$emit('ready')
   },
   watch: {
     // 数据改变
diff --git a/src/pages/demo/chart/index/index.vue b/src/pages/demo/chart/index/index.vue
index c1ab3813..59fcea76 100644
--- a/src/pages/demo/chart/index/index.vue
+++ b/src/pages/demo/chart/index/index.vue
@@ -4,49 +4,49 @@
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(0)" title="G2LineBase"></ChartCardHeader>
-          <G2LineBase :ref="chart[0].refName" v-bind="chart[0]"></G2LineBase>
+          <G2LineBase :ref="chart[0].refName" v-bind="chart[0]" @ready="chart[0].ready = true"></G2LineBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(1)" title="G2LineStep"></ChartCardHeader>
-          <G2LineStep :ref="chart[1].refName" v-bind="chart[1]"></G2LineStep>
+          <G2LineStep :ref="chart[1].refName" v-bind="chart[1]" @ready="chart[1].ready = true"></G2LineStep>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(2)" title="G2ColumnBase"></ChartCardHeader>
-          <G2ColumnBase :ref="chart[2].refName" v-bind="chart[2]"></G2ColumnBase>
+          <G2ColumnBase :ref="chart[2].refName" v-bind="chart[2]" @ready="chart[2].ready = true"></G2ColumnBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(3)" title="G2BarBase"></ChartCardHeader>
-          <G2BarBase :ref="chart[3].refName" v-bind="chart[3]"></G2BarBase>
+          <G2BarBase :ref="chart[3].refName" v-bind="chart[3]" @ready="chart[3].ready = true"></G2BarBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(4)" title="G2PieBase"></ChartCardHeader>
-          <G2PieBase :ref="chart[4].refName" v-bind="chart[4]"></G2PieBase>
+          <G2PieBase :ref="chart[4].refName" v-bind="chart[4]" @ready="chart[4].ready = true"></G2PieBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(5)" title="G2NightingaleRoseBase"></ChartCardHeader>
-          <G2NightingaleRoseBase :ref="chart[5].refName" v-bind="chart[5]"></G2NightingaleRoseBase>
+          <G2NightingaleRoseBase :ref="chart[5].refName" v-bind="chart[5]" @ready="chart[5].ready = true"></G2NightingaleRoseBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(6)" title="G2RadarBase"></ChartCardHeader>
-          <G2RadarBase :ref="chart[6].refName" v-bind="chart[6]"></G2RadarBase>
+          <G2RadarBase :ref="chart[6].refName" v-bind="chart[6]" @ready="chart[6].ready = true"></G2RadarBase>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
         <el-card class="header-in">
           <ChartCardHeader slot="header" @refresh="handleRefreshData(7)" title="G2AreaBase"></ChartCardHeader>
-          <G2AreaBase :ref="chart[7].refName" v-bind="chart[7]"></G2AreaBase>
+          <G2AreaBase :ref="chart[7].refName" v-bind="chart[7]" @ready="chart[7].ready = true"></G2AreaBase>
         </el-card>
       </el-col>
     </el-row>
@@ -65,51 +65,65 @@ export default {
         {
           api: {url: '/api/chart/G2Line', data: {type: 'base'}},
           refName: 'G2LineBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Line', data: {type: 'step'}},
           refName: 'G2LineStep',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Column', data: {type: 'base'}},
           refName: 'G2ColumnBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Bar', data: {type: 'base'}},
           refName: 'G2BarBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Pie', data: {type: 'base'}},
           refName: 'G2PieBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2NightingaleRose', data: {type: 'base'}},
           refName: 'G2NightingaleRoseBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Radar', data: {type: 'base'}},
           refName: 'G2RadarBase',
+          ready: false,
           data: []
         },
         {
           api: {url: '/api/chart/G2Area', data: {type: 'base'}},
           refName: 'G2AreaBase',
+          ready: false,
           data: []
         }
       ]
     }
   },
-  mounted () {
-    // 请求图表数据
-    setTimeout(() => {
-      this.syncData()
-    }, 1000)
+  computed: {
+    ready () {
+      return !this.chart.find(e => !e.ready)
+    }
+  },
+  watch: {
+    ready (ready) {
+      if (ready) {
+        this.syncData()
+      }
+    }
   },
   methods: {
     // 请求图表数据