feat: 柱状图和折线图新增维度坐标名称设置

vueblocks · Mar 18, 2021 · 3e48792 · 3e48792
1 parent 2d87fd6
commit 3e48792
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 3 deletions.
diff --git a/docs/chart-bar.md b/docs/chart-bar.md
@@ -701,6 +701,7 @@
 | yAxisMin | 坐标轴刻度最小值 | Array | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.min) |
 | yAxisScale | 是否是脱离 0 值比例。设置成 true 后坐标刻度不会强制包含零刻度 | Boolean | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.scale)  |
 | yAxisName | 坐标轴名称 | Array | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.name)  |
+| xAxisName | 坐标轴名称 | String | - | 参见[文档](https://echarts.apache.org/zh/option.html#xAxis.name)  |
 | percentage | 是否是百分比堆叠柱状图，通常结合 `yAxisLabelType` 一起使用 | Boolean | `true`/`false` | 默认 `false`  |
 | xAxisInverse | X轴方向反向| Boolean | `true`/`false` | 默认 `false`  参见[文档](https://www.echartsjs.com/zh/option.html#xAxis.inverse) |
 | yAxisInverse | Y轴方向反向| Boolean/Array | `true`/`false` | 默认 `false`   参见[文档](https://www.echartsjs.com/zh/option.html#yAxis.inverse) |

diff --git a/docs/chart-line.md b/docs/chart-line.md
@@ -437,6 +437,7 @@
 | yAxisMin | 坐标轴刻度最小值 | Number | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.min) |
 | yAxisScale | 是否是脱离 0 值比例。设置成 true 后坐标刻度不会强制包含零刻度 | Boolean | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.scale)  |
 | yAxisName | 坐标轴名称 | String | - | 参见[文档](https://www.echartsjs.com/option.html#yAxis.name)  |
+| xAxisName | 坐标轴名称 | String | - | 参见[文档](https://echarts.apache.org/zh/option.html#xAxis.name)  |
 | percentage | 是否是百分比堆叠面积图，通常结合 `yAxisLabelType` 一起使用 | Boolean | `true`/`false` | 默认 `false`  |
 | tooltipOptions | 配置tooltip提示框组件 | Object | - | 参见[文档](https://echarts.apache.org/zh/option.html#tooltip)  |
 | legendOptions | 配置图例组件 | Object | - | 参见[文档](https://echarts.apache.org/zh/option.html#legend)  |

diff --git a/src/packages/bar/chart.js b/src/packages/bar/chart.js
@@ -48,7 +48,7 @@ class BarChart extends BaseChart {
 
   // build dimension Axis
   static getBarDimAxis (settings) {
-    const { dimAxisType, dimAxisLineShow, dimAxisLabelShow, dimAxisLabelColor } = settings
+    const { dimAxisType, dimAxisLineShow, dimAxisLabelShow, dimAxisLabelColor, xAxisName } = settings
 
     const axisItem = {
       type: dimAxisType,
@@ -65,6 +65,10 @@ class BarChart extends BaseChart {
         color: Array.isArray(dimAxisLabelColor) ? dimAxisLabelColor[0] : dimAxisLabelColor
       }
     }
+    if (xAxisName) {
+      axisItem.name = xAxisName
+    }
+
     const disAxis = []
     disAxis.push(axisItem)
     return disAxis

diff --git a/src/packages/line/chart.js b/src/packages/line/chart.js
@@ -25,7 +25,7 @@ class LineChart extends BaseChart {
   }
 
   static getLineDimAxis ({ settings }) {
-    const { yAxisType, xAxisLabelShow = true, xAxisLineShow = true, xAxisLabelColor, xAxisInverse = false } = settings
+    const { yAxisType, xAxisLabelShow = true, xAxisLineShow = true, xAxisLabelColor, xAxisInverse = false, xAxisName } = settings
     const type = yAxisType || 'category'
     return {
       type,
@@ -42,7 +42,8 @@ class LineChart extends BaseChart {
         fontWeight: 400,
         color: xAxisLabelColor || null
       },
-      inverse: xAxisInverse
+      inverse: xAxisInverse,
+      name: xAxisName !== undefined ? xAxisName : null
     }
   }