no message

Former-commit-id: f5c40fc8075c0213f9b67dde351a24b326ded340
Former-commit-id: 49e4b22d84089c1e4097bc24c9b2a8933747cea6
Former-commit-id: e6bb925b422085bc03275d7f51d6dada2b87e6d0

src/components/charts/G2/components/NightingaleRose/base.vue

@@ -0,0 +1,35 @@
+<template>
+  <!-- 如果需要开启自动高度功能 需要在这里设置 style="height: 100%;" -->
+  <div ref="chart" style="height: 100%;"></div>
+</template>
+
+<script>
+import G2 from '@/components/charts/G2/mixins/G2.js'
+export default {
+  mixins: [
+    G2
+  ],
+  methods: {
+    // 初始化图表
+    init () {
+      // mixin 中提供 creatChart
+      this.creatChart()
+      // 本组件的特殊设置
+      this.chart.source(this.data)
+      this.chart.axis('x', {
+        label: {
+          offset: 12
+        }
+      })
+      this.chart.coord().transpose()
+      this.chart.interval().position('x*y')
+      // 渲染图表
+      this.chart.render()
+    },
+    // 数据源改变 重新渲染新的数据
+    changeData () {
+      this.chart.changeData(this.data)
+    }
+  }
+}
+</script>

src/components/charts/G2/mixins/props/chart.js

@@ -14,7 +14,7 @@ export default {
   // 设置图表的内边距 http://antv.alipay.com/zh-cn/g2/3.x/api/chart.html#_padding
   padding: {
     required: false,
-    default: () => [40, 40, 40, 40]
+    default: () => [30, 40, 50, 50]
   },
   // 设置图表整体的边框和背景样式 http://antv.alipay.com/zh-cn/g2/3.x/api/chart.html#_background
   background: {

src/components/charts/register.js

@@ -1,10 +1,12 @@
 import Vue from 'vue'
 
+Vue.component('G2BarBase', resolve => { require(['@/components/charts/G2/components/Bar/base.vue'], resolve) })
+
+Vue.component('G2ColumnBase', resolve => { require(['@/components/charts/G2/components/Column/base.vue'], resolve) })
+
 Vue.component('G2LineBase', resolve => { require(['@/components/charts/G2/components/Line/base.vue'], resolve) })
 Vue.component('G2LineStep', resolve => { require(['@/components/charts/G2/components/Line/step.vue'], resolve) })
 
-Vue.component('G2ColumnBase', resolve => { require(['@/components/charts/G2/components/Column/base.vue'], resolve) })
-
-Vue.component('G2BarBase', resolve => { require(['@/components/charts/G2/components/Bar/base.vue'], resolve) })
+Vue.component('G2NightingaleRoseBase', resolve => { require(['@/components/charts/G2/components/NightingaleRose/base.vue'], resolve) })
 
 Vue.component('G2PieBase', resolve => { require(['@/components/charts/G2/components/Pie/base.vue'], resolve) })