diff --git a/src/pages/demo/chart/demo/PieBase.vue b/src/pages/demo/chart/demo/PieBase.vue
index 73e67aab..d347ba64 100644
--- a/src/pages/demo/chart/demo/PieBase.vue
+++ b/src/pages/demo/chart/demo/PieBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-pie-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-pie-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/areaBase.vue b/src/pages/demo/chart/demo/areaBase.vue
index e13c2606..eb324ca8 100644
--- a/src/pages/demo/chart/demo/areaBase.vue
+++ b/src/pages/demo/chart/demo/areaBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-area-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-area-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/barBase.vue b/src/pages/demo/chart/demo/barBase.vue
index a257df0d..f31fcc5a 100644
--- a/src/pages/demo/chart/demo/barBase.vue
+++ b/src/pages/demo/chart/demo/barBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-bar-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-bar-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/columnBase.vue b/src/pages/demo/chart/demo/columnBase.vue
index c6da31a0..eab38ea2 100644
--- a/src/pages/demo/chart/demo/columnBase.vue
+++ b/src/pages/demo/chart/demo/columnBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-column-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-column-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/components/ChartDemoCard.vue b/src/pages/demo/chart/demo/components/d2-demo-chart-card.vue
similarity index 100%
rename from src/pages/demo/chart/demo/components/ChartDemoCard.vue
rename to src/pages/demo/chart/demo/components/d2-demo-chart-card.vue
diff --git a/src/pages/demo/chart/demo/lineBase.vue b/src/pages/demo/chart/demo/lineBase.vue
index b01286e3..434fa57e 100644
--- a/src/pages/demo/chart/demo/lineBase.vue
+++ b/src/pages/demo/chart/demo/lineBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-line-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-line-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/lineStep.vue b/src/pages/demo/chart/demo/lineStep.vue
index 802fcbc9..fd559668 100644
--- a/src/pages/demo/chart/demo/lineStep.vue
+++ b/src/pages/demo/chart/demo/lineStep.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-line-step slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-line-step>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/mixins/public.js b/src/pages/demo/chart/demo/mixins/public.js
index 17c839b4..7a0b5698 100644
--- a/src/pages/demo/chart/demo/mixins/public.js
+++ b/src/pages/demo/chart/demo/mixins/public.js
@@ -1,5 +1,5 @@
 export default {
   components: {
-    ChartDemoCard: () => import('../components/ChartDemoCard.vue')
+    'd2-demo-chart-card': () => import('../components/d2-demo-chart-card.vue')
   }
 }
diff --git a/src/pages/demo/chart/demo/nightingaleRoseBase.vue b/src/pages/demo/chart/demo/nightingaleRoseBase.vue
index e7e4f1f6..0e52ce20 100644
--- a/src/pages/demo/chart/demo/nightingaleRoseBase.vue
+++ b/src/pages/demo/chart/demo/nightingaleRoseBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-nightingale-rose-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-nightingale-rose-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/radarBase.vue b/src/pages/demo/chart/demo/radarBase.vue
index 6451b317..e319081b 100644
--- a/src/pages/demo/chart/demo/radarBase.vue
+++ b/src/pages/demo/chart/demo/radarBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-radar-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-radar-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>