feat: 雷达图新增 innerRadius、startAngle、endAngle (#2323)

* feat: 雷达图支持配置坐标系startAngle、endAngle、innerRadius * docs: default * refactor: del innerRadius * Update coordinate-spec.ts Co-authored-by: 沈杨 <[email protected]> Co-authored-by: hustcc <[email protected]>
antvis · Feb 10, 2021 · 1163917 · 1163917
1 parent 52765fd
commit 1163917
Show file tree

Hide file tree

Showing 5 changed files with 66 additions and 9 deletions.
diff --git a/__tests__/unit/plots/radar/coordinate-spec.ts b/__tests__/unit/plots/radar/coordinate-spec.ts
@@ -0,0 +1,27 @@
+import { Radar } from '../../../../src';
+import { SINGLE_DATA } from '../../../data/radar';
+import { createDiv } from '../../../utils/dom';
+
+describe('radar', () => {
+  it('set innerRadius & startAngle & endAngle', () => {
+    const radar = new Radar(createDiv(), {
+      width: 400,
+      height: 300,
+      data: SINGLE_DATA,
+      xField: 'name',
+      yField: 'value',
+      radius: 0.8,
+      startAngle: 0,
+      endAngle: Math.PI,
+    });
+
+    radar.render();
+
+    const coordinate = radar.chart.getCoordinate();
+    const { startAngle, endAngle } = coordinate;
+    expect(startAngle).toBe(0);
+    expect(endAngle).toBe(Math.PI);
+
+    radar.destroy();
+  });
+});
diff --git a/docs/api/plots/radar.en.md b/docs/api/plots/radar.en.md
@@ -72,6 +72,18 @@ A field that groups a radar map, usually corresponding to a classification field
 
 The radius of the radar map, starting at the center of the drawing area (not including the chart component area). The configuration range is (0,1), where 1 means to fill the drawing area.
 
+#### startAngle
+
+<description>**optional** _number_ _default:_ `(Math.PI * 0) / 180`</description>
+
+The starting Angle of the disk.
+
+#### endAngle
+
+<description>**optional** _number_ _default:_ `(Math.PI * 180) / 180`</description>
+
+The termination Angle of the disk.
+
 `markdown:docs/common/color.en.md`
 
 #### smooth

diff --git a/docs/api/plots/radar.zh.md b/docs/api/plots/radar.zh.md
@@ -46,41 +46,53 @@ const radarPlot = new Radar('container', {
 radarPlot.render();
 ```
 
-#### xField 
+#### xField
 
 <description>**required** _string_</description>
 
 雷达图映射到圆周角度所对应的字段，一般为一个分类字段。
 
-#### yField 
+#### yField
 
 <description>**required** _string_</description>
 
 雷达图映射到半径所对应的字段，一般为一个连续字段。
 
-#### seriesField 
+#### seriesField
 
 <description>**required** _string_</description>
 
 对雷达图进行分组的字段，一般对应一个分类字段。通过该字段的值，雷达图将会被分为多个组，通过颜色进行区分，并上下重叠。
 
 ### 图形样式
 
-#### radius 
+#### radius
 
 <description>**optional** _number_</description>
 
 雷达图的半径，原点为绘图区域中心（不包含图表组件区域）。配置值域为 (0,1]，1 代表撑满绘图区域。
 
+#### startAngle
+
+<description>**optional** _number_ _default:_ `(Math.PI * 0) / 180`</description>
+
+配置坐标系的起始角度。
+
+#### endAngle
+
+<description>**optional** _number_ _default:_ `(Math.PI * 180) / 180`</description>
+
+配置坐标系的结束角度。
+
 `markdown:docs/common/color.zh.md`
 
-#### smooth 
+#### smooth
 
 <description>**optional** _boolean_ _default:_ `false`</description>
 
 是否以曲线的形态绘制 (spline)。
 
-#### lineStyle 
+#### lineStyle
 
 <description>**optional** _object ｜ Function_</description>
 
@@ -101,15 +113,15 @@ radarPlot.render();
 }
 ```
 
-#### point 
+#### point
 
 <description>**optional** _object_</description>
 
 配置雷达图上的点
 
 `markdown:docs/common/point-style.zh.md`
 
-#### area 
+#### area
 
 <description>**optional** _object_</description>
 

diff --git a/src/plots/radar/adaptor.ts b/src/plots/radar/adaptor.ts
@@ -73,10 +73,12 @@ function meta(params: Params<RadarOptions>): Params<RadarOptions> {
  */
 function coord(params: Params<RadarOptions>): Params<RadarOptions> {
   const { chart, options } = params;
-  const { radius } = options;
+  const { radius, startAngle, endAngle } = options;
 
   chart.coordinate('polar', {
     radius,
+    startAngle,
+    endAngle,
   });
   return params;
 }

diff --git a/src/plots/radar/types.ts b/src/plots/radar/types.ts
@@ -22,4 +22,8 @@ export interface RadarOptions extends Options {
   readonly yAxis?: any;
   /** 雷达图半径 */
   readonly radius?: number;
+  /** 雷达图开始角度 */
+  readonly startAngle?: number;
+  /** 雷达图结束角度 */
+  readonly endAngle?: number;
 }