xt-element-ui 2.1.61 → 2.2.0

package/docs/components/base/xt-bar.md

@@ -5,7 +5,7 @@
 ::: demo 基本用法
 ```vue
 <template>
-  <XtBar :chart-data="chartData" width="600px" height="400px"  />
+  <div class="demo-container"><XtBar :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -55,7 +55,7 @@ export default {
 ::: demo 横向柱状图
 ```vue
 <template>
-  <XtBar :chart-data="chartData" reverse />
+  <div  class="demo-container"><XtBar :chart-data="chartData" reverse /></div>
 </template>
 
 <script>
@@ -80,7 +80,7 @@ export default {
 ::: demo 显示数据标记
 ```vue
 <template>
-  <XtBar :chart-data="chartData" :mark-point="true" />
+  <div  class="demo-container"><XtBar :chart-data="chartData" :mark-point="true" /></div>
 </template>
 
 <script>
@@ -106,7 +106,7 @@ export default {
 ::: demo 极简模式
 ```vue
 <template>
-  <XtBar :chart-data="chartData" simple-mode />
+  <div  class="demo-container"><XtBar :chart-data="chartData"  simple-mode /></div>
 </template>
 
 <script>
@@ -130,7 +130,7 @@ export default {
 ::: demo 自定义字段映射
 ```vue
 <template>
-  <XtBar :chart-data="chartData" :field-keys="{ label: 'name', value: 'score' }" />
+  <div  class="demo-container"><XtBar :chart-data="chartData" :field-keys="{ label: 'name', value: 'score' }" /></div>
 </template>
 
 <script>

package/docs/components/base/xt-chart.md

@@ -5,7 +5,7 @@
 ::: demo 基本用法
 ```vue
 <template>
-  <XtChart type="bar" :chart-data="chartData" style="height: 400px;" />
+  <div class="demo-container"><XtChart type="bar" :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -39,7 +39,7 @@ export default {
 ::: demo 柱状图
 ```vue
 <template>
-  <XtChart type="bar" :chart-data="chartData" style="height: 400px;" />
+  <div class="demo-container"><XtChart type="bar" :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -65,7 +65,7 @@ export default {
 ::: demo 折线图
 ```vue
 <template>
-  <XtChart type="line" :chart-data="chartData" style="height: 400px;" />
+  <div class="demo-container"><XtChart type="line" :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -91,7 +91,7 @@ export default {
 ::: demo 饼图
 ```vue
 <template>
-  <XtChart type="pie" :chart-data="chartData" style="height: 400px;" />
+  <div class="demo-container"><XtChart type="pie" :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -116,7 +116,7 @@ export default {
 ::: demo 组合图
 ```vue
 <template>
-  <XtChart type="multi" :chart-data="chartData" style="height: 400px;" />
+  <div class="demo-container"><XtChart type="multi" :chart-data="chartData" /></div>
 </template>
 
 <script>

package/docs/components/base/xt-line.md

@@ -5,7 +5,7 @@
 ::: demo 基本用法
 ```vue
 <template>
-  <XtLine :chart-data="chartData" />
+  <div class="demo-container"><XtLine :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -44,7 +44,7 @@ export default {
 ::: demo 面积图
 ```vue
 <template>
-  <XtLine :chart-data="chartData" :is-area="true" />
+  <div class="demo-container"><XtLine :chart-data="chartData" :is-area="true" /></div>
 </template>
 
 <script>
@@ -70,7 +70,7 @@ export default {
 ::: demo 极简模式
 ```vue
 <template>
-  <XtLine :chart-data="chartData" simple-mode />
+  <div class="demo-container"><XtLine :chart-data="chartData" simple-mode /></div>
 </template>
 
 <script>
@@ -94,7 +94,7 @@ export default {
 ::: demo 自定义字段映射
 ```vue
 <template>
-  <XtLine :chart-data="chartData" :field-keys="{ label: 'month', value: 'amount' }" />
+  <div class="demo-container"><XtLine :chart-data="chartData" :field-keys="{ label: 'month', value: 'amount' }" /></div>
 </template>
 
 <script>

package/docs/components/base/xt-multi.md

@@ -5,7 +5,7 @@
 ::: demo 基本用法
 ```vue
 <template>
-  <XtMulti :chart-data="chartData" />
+  <div class="demo-container"><XtMulti :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -68,7 +68,7 @@ export default {
 ::: demo 多单位组合图
 ```vue
 <template>
-  <XtMulti :chart-data="chartData" />
+  <div class="demo-container"><XtMulti :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -116,7 +116,7 @@ export default {
 ::: demo 折线与柱状图组合
 ```vue
 <template>
-  <XtMulti :chart-data="chartData" />
+  <div class="demo-container"><XtMulti :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -157,7 +157,7 @@ export default {
 ::: demo 自定义颜色
 ```vue
 <template>
-  <XtMulti :chart-data="chartData" :colors="['#1890ff', '#52c41a', '#faad14']" />
+  <div class="demo-container"><XtMulti :chart-data="chartData" :colors="['#1890ff', '#52c41a', '#faad14']" /></div>
 </template>
 
 <script>
@@ -202,7 +202,7 @@ export default {
 ::: demo 极简模式
 ```vue
 <template>
-  <XtMulti :chart-data="chartData" simple-mode />
+  <div class="demo-container"><XtMulti :chart-data="chartData" simple-mode /></div>
 </template>
 
 <script>

package/docs/components/base/xt-pie.md

@@ -5,7 +5,7 @@
 ::: demo 基本用法
 ```vue
 <template>
-  <XtPie :chart-data="chartData" />
+  <div class="demo-container"><XtPie :chart-data="chartData" /></div>
 </template>
 
 <script>
@@ -47,7 +47,7 @@ export default {
 ::: demo 玫瑰图
 ```vue
 <template>
-  <XtPie :chart-data="chartData" rose-type="radius" />
+  <div class="demo-container"><XtPie :chart-data="chartData" rose-type="radius" /></div>
 </template>
 
 <script>
@@ -73,7 +73,7 @@ export default {
 ::: demo 隐藏图例
 ```vue
 <template>
-  <XtPie :chart-data="chartData" :show-legend="false" />
+  <div class="demo-container"><XtPie :chart-data="chartData" :show-legend="false" /></div>
 </template>
 
 <script>
@@ -98,7 +98,7 @@ export default {
 ::: demo 自定义颜色
 ```vue
 <template>
-  <XtPie :chart-data="chartData" :colors="['#1890ff', '#52c41a', '#faad14', '#f5222d']" />
+  <div class="demo-container"><XtPie :chart-data="chartData" :colors="['#1890ff', '#52c41a', '#faad14', '#f5222d']" /></div>
 </template>
 
 <script>
@@ -123,7 +123,7 @@ export default {
 ::: demo 极简模式
 ```vue
 <template>
-  <XtPie :chart-data="chartData" simple-mode />
+  <div class="demo-container"><XtPie :chart-data="chartData" simple-mode /></div>
 </template>
 
 <script>