feat(YAxis): add transposeNameText prop

rsuite · Jun 16, 2022 · 1db822a · 1db822a
1 parent 29e9602
commit 1db822a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 4 deletions.
diff --git a/src/components/YAxis.ts b/src/components/YAxis.ts
@@ -6,6 +6,14 @@ export type YAxisProps = Omit<YAXisComponentOption, 'axisLine' | 'axisLabel' | '
   axisLine?: YAXisComponentOption['axisLine'] | boolean;
   axisLabel?: YAXisComponentOption['axisLabel'] | boolean | AxisLabelFormatter;
   splitLine?: YAXisComponentOption['splitLine'] | boolean;
+
+  /**
+   * When nameLocation="middle",
+   * whether to transpose the axis name text into vertical direction.
+   * 
+   * @default true
+   */
+  transposeNameText?: boolean;
 };
 
 function YAxis(_: YAxisProps) {

diff --git a/src/utils.ts b/src/utils.ts
@@ -6,6 +6,7 @@ import * as echarts from 'echarts/core';
 import { TitleComponent } from 'echarts/components';
 import { symbols } from './constants';
 import { ChartComponentProps } from './ECharts';
+import type { YAxisProps } from './components/YAxis';
 
 echarts.use([TitleComponent]);
 
@@ -256,19 +257,22 @@ const createOptions = {
       option.xAxis.push(xAxisOption);
     }
   },
-  [symbols.yAxis](option: any, props: any, _: any) {
+  [symbols.yAxis](option: any, props: YAxisProps, _: any) {
     function getOption() {
-      const { name, axisLabel, splitLine, ...rest } = props;
+      const { name, axisLabel, splitLine, transposeNameText = true, ...rest } = props;
 
       return _merge(
         {
-          nameRotate: 0,
-          name: name && rest.nameLocation === 'middle' ? name.split('').join('\n') : name,
+          name,
           nameTextStyle: {
             fontSize: 12,
             color: '#575757'
           }
         },
+        (name && rest.nameLocation === 'middle' && transposeNameText) ? {
+          nameRotate: 0,
+          name: name.split('').join('\n') 
+        } : {},
         typeof splitLine !== 'undefined'
           ? {
               splitLine: _merge(