no message

Former-commit-id: 3d89a48b4812432b1d8fb172550496ec368fe7b4
Former-commit-id: 2dfe3f42701c9bcba739c617db883cef7b515bf1
Former-commit-id: cf80d852d653158aa395be003359b46830741bb4

src/components/G2/Line/1.vue

@@ -10,6 +10,8 @@ export default {
   ],
   data () {
     return {
+      // 在组件 mounted 后立即初始化图表
+      autoInit: false,
       // [图表设置项] padding
       padding: [30, 40, 50, 50]
     }

src/components/G2/Pie/1.vue

@@ -8,31 +8,34 @@ export default {
   mixins: [
     G2Mixin
   ],
-  methods: {
-    // 初始化图表
-    initHandler () {
-      const { DataView } = this.dataSet
-      const data = [
-        { item: '事例一', count: 40 },
-        { item: '事例二', count: 21 },
-        { item: '事例三', count: 17 },
-        { item: '事例四', count: 13 },
-        { item: '事例五', count: 9 }
-      ]
-      const dv = new DataView()
-      dv.source(data).transform({
+  data () {
+    return {
+      // [图表设置项] padding
+      padding: [60, 60, 110, 60],
+      // 在组件 mounted 后立即初始化图表
+      // autoInit: false,
+      // DataView数据转换设置
+      transformSetting: {
         type: 'percent',
         field: 'count',
         dimension: 'item',
         as: 'percent'
-      })
+      }
+    }
+  },
+  methods: {
+    dvMaker () {
+      return new this.DataSet.DataView().source(this.data).transform(this.transformSetting)
+    },
+    // 初始化图表
+    initHandler () {
       this.chart = new this.G2.Chart({
         container: this.$refs.chart,
         forceFit: this.forceFit,
         height: this.G2.DomUtil.getHeight(this.$refs.chart),
         padding: this.padding
       })
-      this.chart.source(dv, {
+      this.chart.source(this.dvMaker(), {
         percent: {
           formatter: val => {
             val = (val * 100) + '%'
@@ -67,50 +70,16 @@ export default {
           stroke: '#fff'
         })
       this.chart.render()
-      // this.chart = new this.G2.Chart({
-      //   container: this.$refs.chart,
-      //   forceFit: this.forceFit,
-      //   height: this.G2.DomUtil.getHeight(this.$refs.chart),
-      //   padding: this.padding
-      // })
-      // this.chart.guide().text({
-      //   top: true,
-      //   position: ['min', 'max'],
-      //   content: this.title,
-      //   style: {
-      //     fill: '#666', // 文本颜色
-      //     fontSize: '16', // 文本大小
-      //     fontWeight: 'bold' // 文本粗细
-      //   },
-      //   offsetX: 0,
-      //   offsetY: 0
-      // })
-      // this.chart.source(this.data)
-      // this.chart.scale('value', {
-      //   min: 0
-      // })
-      // this.chart.scale('year', {
-      //   range: [0, 1]
-      // })
-      // this.chart.tooltip({
-      //   crosshairs: {
-      //     type: 'line'
-      //   }
-      // })
-      // this.chart.line().position('year*value')
-      // this.chart.point().position('year*value').size(4).shape('circle').style({
-      //   stroke: '#fff',
-      //   lineWidth: 1
-      // })
-      // this.chart.render()
     },
     // 数据源改变 重新渲染新的数据
     changeData () {
       if (this.chart) {
         // 已经初始化过图表 更新数据
-        this.chart.changeData(this.data)
+        console.log(1)
+        this.chart.changeData(this.dvMaker())
       } else {
         // 没有图表 新创建一个实例
+        console.log(2)
         this.initHandler()
       }
     }

src/components/G2/mixins/G2.js

@@ -1,5 +1,5 @@
 import G2 from '@antv/g2'
-import * as dataSet from '@antv/data-set'
+import * as DataSet from '@antv/data-set'
 // 关闭 G2 的体验改进计划打点请求
 G2.track(false)
 
@@ -11,12 +11,6 @@ export default {
       required: false,
       default: () => []
     },
-    // 在组件 mounted 后立即初始化图表
-    autoInit: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
     // [图表设置项] 高度
     height: {
       type: Number,
@@ -41,9 +35,11 @@ export default {
       // 在页面中不需要再引入 直接使用 this.G2
       G2,
       // 数据处理模块
-      dataSet,
+      DataSet,
       // 图表实例
       chart: null,
+      // 在组件 mounted 后立即初始化图表
+      autoInit: true,
       // [图表设置项] padding
       padding: [40, 40, 40, 40]
     }