Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Merged
merged 4 commits into from
Feb 10, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 27 additions & 0 deletions __tests__/unit/plots/radar/coordinate-spec.ts
Original file line number Diff line number Diff line change
@@ -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();
});
});
12 changes: 12 additions & 0 deletions docs/api/plots/radar.en.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
28 changes: 20 additions & 8 deletions docs/api/plots/radar.zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -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>

Expand All @@ -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>

Expand Down
4 changes: 3 additions & 1 deletion src/plots/radar/adaptor.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
Expand Down
4 changes: 4 additions & 0 deletions src/plots/radar/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,4 +22,8 @@ export interface RadarOptions extends Options {
readonly yAxis?: any;
/** 雷达图半径 */
readonly radius?: number;
/** 雷达图开始角度 */
readonly startAngle?: number;
/** 雷达图结束角度 */
readonly endAngle?: number;
}