From 7da96075b8929e8e5c5d71ca3aed98e7970705e9 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Wed, 28 Oct 2020 17:39:24 +0800
Subject: [PATCH 01/15] feat: add radial bar adaptor

---
 __tests__/unit/plots/radial-bar/index-spec.ts | 31 +++++++++
 src/index.ts                                  |  3 +
 src/plots/radial-bar/adaptor.ts               | 64 +++++++++++++++----
 src/plots/radial-bar/index.ts                 | 16 +++++
 src/plots/radial-bar/types.ts                 |  4 ++
 5 files changed, 107 insertions(+), 11 deletions(-)
 create mode 100644 __tests__/unit/plots/radial-bar/index-spec.ts

diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
new file mode 100644
index 0000000000..a9af6e377e
--- /dev/null
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -0,0 +1,31 @@
+import { RadialBar } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+
+describe('radial-bar', () => {
+  it('x*y', () => {
+    const radialBar = new RadialBar(createDiv(), {
+      width: 400,
+      height: 300,
+      appendPadding: 10,
+      data: [
+        { question: '问题 1', percent: 0.21 },
+        { question: '问题 2', percent: 0.4 },
+        { question: '问题 3', percent: 0.49 },
+        { question: '问题 4', percent: 0.52 },
+        { question: '问题 5', percent: 0.53 },
+        { question: '问题 6', percent: 0.84 },
+        { question: '问题 7', percent: 1.0 },
+        { question: '问题 8', percent: 1.2 },
+      ],
+      xField: 'question',
+      yField: 'percent',
+      barStyle: {
+        fill: 'red',
+        fillOpacity: 0.6,
+        cursor: 'pointer',
+      },
+      color: '#BAE7FF-#1890FF-#0050B3',
+    });
+    radialBar.render();
+  });
+});
diff --git a/src/index.ts b/src/index.ts
index 9785ea6668..4f17c6d6ca 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -98,3 +98,6 @@ export { line, interval, area, point, polygon } from './adaptor/geometries';
 
 /** 对于没有开发完成的图表，可以暂时先放到 Lab 下面，先做体验，稳定后放到根 export */
 export { Lab } from './lab';
+
+// 玉珏图
+export { RadialBar } from './plots/radial-bar';
diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index 33193149a2..d329bce000 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -1,4 +1,4 @@
-import { interaction, animation, theme, scale } from '../../adaptor/common';
+import { interaction, animation, theme, scale, tooltip, legend } from '../../adaptor/common';
 import { Params } from '../../core/adaptor';
 import { flow } from '../../utils';
 import { RadialBarOptions } from './types';
@@ -9,12 +9,15 @@ import { RadialBarOptions } from './types';
  */
 function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { chart, options } = params;
-  const { data, xField, yField } = options;
-
+  const { data, xField, yField, barStyle, color } = options;
   chart.data(data);
-
-  chart.interval().position(`${xField}*${yField}`);
-
+  const interval = chart.interval().position(`${xField}*${yField}`);
+  if (barStyle) {
+    interval.style(barStyle);
+  }
+  if (color) {
+    interval.color(`${yField}`, color);
+  }
   return params;
 }
 
@@ -24,15 +27,50 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  */
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { options } = params;
-  const { xAxis, yAxis, xField, yField } = options;
-
+  const { xField, yField } = options;
   return flow(
     scale({
-      [xField]: xAxis,
-      [yField]: yAxis,
+      [xField]: false,
+      [yField]: {
+        min: 0,
+        max: 2,
+      },
     })
   )(params);
 }
+
+/**
+ * coordinate 配置
+ * @param params
+ */
+function coordinate(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
+  const { chart } = params;
+  chart
+    .coordinate({
+      type: 'polar',
+      cfg: {
+        innerRadius: 0.1,
+      },
+    })
+    .transpose();
+  return params;
+}
+
+/**
+ * axis 配置
+ * @param params
+ */
+export function axis(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
+  const { chart, options } = params;
+  const { xField } = options;
+  chart.axis(xField, {
+    grid: null,
+    tickLine: null,
+    line: null,
+  });
+  return params;
+}
+
 /**
  * 图适配器
  * @param chart
@@ -43,9 +81,13 @@ export function adaptor(params: Params<RadialBarOptions>) {
   return flow(
     geometry,
     meta,
+    axis,
+    coordinate,
     interaction,
     animation,
-    theme
+    theme,
+    tooltip,
+    legend
     // ... 其他的 adaptor flow
   )(params);
 }
diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index 8a6e154c70..712fa4cf4d 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -1,3 +1,4 @@
+import { deepMix } from '@antv/util';
 import { Plot } from '../../core/plot';
 import { Adaptor } from '../../core/adaptor';
 import { RadialBarOptions } from './types';
@@ -12,6 +13,21 @@ export class RadialBar extends Plot<RadialBarOptions> {
   /** 图表类型 */
   public type: string = 'radial-bar';
 
+  /**
+   * 获取默认配置
+   */
+  protected getDefaultOptions(options: RadialBarOptions) {
+    const { xField } = options;
+    return deepMix({}, super.getDefaultOptions(), {
+      interactions: [{ type: 'element-active' }],
+      legend: false,
+      tooltip: {
+        title: xField,
+        showMarkers: false,
+      },
+    });
+  }
+
   /**
    * 获取适配器
    */
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index c4b99a673c..bba9adebdf 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -1,4 +1,6 @@
+import { ShapeAttrs } from '@antv/g-base/lib/types';
 import { Options } from '../../types';
+// import { ColumnOptions } from '../column/types';
 
 /** 配置类型定义 */
 export interface RadialBarOptions extends Options {
@@ -6,4 +8,6 @@ export interface RadialBarOptions extends Options {
   readonly xField?: string;
   /** y 轴字段 */
   readonly yField?: string;
+  /** 样式 */
+  readonly barStyle?: ShapeAttrs;
 }

From 2d1a95951ebd54d5d5268af68efbbf42796b2dfe Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Wed, 28 Oct 2020 23:45:51 +0800
Subject: [PATCH 02/15] feat: add some unit test files

---
 __tests__/unit/plots/radial-bar/axis-spec.ts  |  0
 __tests__/unit/plots/radial-bar/index-spec.ts | 24 +++++++++++++++++++
 __tests__/unit/plots/radial-bar/style-spec.ts |  0
 .../unit/plots/radial-bar/tooltip-spec.ts     |  0
 4 files changed, 24 insertions(+)
 create mode 100644 __tests__/unit/plots/radial-bar/axis-spec.ts
 create mode 100644 __tests__/unit/plots/radial-bar/style-spec.ts
 create mode 100644 __tests__/unit/plots/radial-bar/tooltip-spec.ts

diff --git a/__tests__/unit/plots/radial-bar/axis-spec.ts b/__tests__/unit/plots/radial-bar/axis-spec.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index a9af6e377e..ad779271a1 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -16,6 +16,18 @@ describe('radial-bar', () => {
         { question: '问题 6', percent: 0.84 },
         { question: '问题 7', percent: 1.0 },
         { question: '问题 8', percent: 1.2 },
+        { question: '问题 9', percent: 0.49 },
+        { question: '问题 10', percent: 0.52 },
+        { question: '问题 11', percent: 0.53 },
+        { question: '问题 12', percent: 0.84 },
+        { question: '问题 13', percent: 1.0 },
+        { question: '问题 14', percent: 1.2 },
+        { question: '问题 15', percent: 0.49 },
+        { question: '问题 16', percent: 0.52 },
+        { question: '问题 17', percent: 0.53 },
+        { question: '问题 18', percent: 0.84 },
+        { question: '问题 19', percent: 1.0 },
+        { question: '问题 20', percent: 1.2 },
       ],
       xField: 'question',
       yField: 'percent',
@@ -25,6 +37,18 @@ describe('radial-bar', () => {
         cursor: 'pointer',
       },
       color: '#BAE7FF-#1890FF-#0050B3',
+      tooltip: {
+        showTitle: false,
+        showCrosshairs: false,
+      },
+      xAxis: {
+        line: {
+          style: {
+            lineWidth: 1,
+            fill: 'red',
+          },
+        },
+      },
     });
     radialBar.render();
   });
diff --git a/__tests__/unit/plots/radial-bar/style-spec.ts b/__tests__/unit/plots/radial-bar/style-spec.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/__tests__/unit/plots/radial-bar/tooltip-spec.ts b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
new file mode 100644
index 0000000000..e69de29bb2

From b4fc576260f70ebbb65765d7df2eb2db9e888c45 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Thu, 29 Oct 2020 16:18:56 +0800
Subject: [PATCH 03/15] feat: add all unit test to radial bar

---
 __tests__/unit/plots/radial-bar/axis-spec.ts  | 48 +++++++++++
 __tests__/unit/plots/radial-bar/index-spec.ts | 86 +++++++++----------
 __tests__/unit/plots/radial-bar/style-spec.ts | 36 ++++++++
 .../unit/plots/radial-bar/tooltip-spec.ts     | 40 +++++++++
 src/plots/radial-bar/adaptor.ts               | 52 ++++++-----
 src/plots/radial-bar/index.ts                 |  3 +-
 src/plots/radial-bar/types.ts                 |  1 -
 7 files changed, 199 insertions(+), 67 deletions(-)

diff --git a/__tests__/unit/plots/radial-bar/axis-spec.ts b/__tests__/unit/plots/radial-bar/axis-spec.ts
index e69de29bb2..c32aa842e2 100644
--- a/__tests__/unit/plots/radial-bar/axis-spec.ts
+++ b/__tests__/unit/plots/radial-bar/axis-spec.ts
@@ -0,0 +1,48 @@
+import { RadialBar } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+
+describe('radial-bar axis', () => {
+  const data = [
+    { question: '问题 1', percent: 0.21 },
+    { question: '问题 2', percent: 0.4 },
+    { question: '问题 3', percent: 0.49 },
+    { question: '问题 4', percent: 0.52 },
+    { question: '问题 5', percent: 0.53 },
+    { question: '问题 6', percent: 0.84 },
+    { question: '问题 7', percent: 1.0 },
+    { question: '问题 8', percent: 1.2 },
+  ];
+  it('xAxis*yAxis', () => {
+    const bar = new RadialBar(createDiv(), {
+      width: 400,
+      height: 300,
+      data,
+      xField: 'question',
+      yField: 'percent',
+      xAxis: {
+        line: {
+          style: {
+            lineWidth: 1,
+            fill: 'red',
+          },
+        },
+      },
+      yAxis: {
+        line: {
+          style: {
+            lineWidth: 1,
+            fill: 'red',
+          },
+        },
+      },
+    });
+    bar.render();
+    const axisOptions = bar.chart.getOptions().axes;
+    expect(axisOptions['percent']).toBeUndefined();
+    expect(axisOptions['question']).toMatchObject({
+      grid: null,
+      line: null,
+      tickLine: null,
+    });
+  });
+});
diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index ad779271a1..dd09228cc9 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -2,54 +2,52 @@ import { RadialBar } from '../../../../src';
 import { createDiv } from '../../../utils/dom';
 
 describe('radial-bar', () => {
-  it('x*y', () => {
-    const radialBar = new RadialBar(createDiv(), {
+  const data = [
+    { question: '问题 1', percent: 0.21 },
+    { question: '问题 2', percent: 0.4 },
+    { question: '问题 3', percent: 0.49 },
+    { question: '问题 4', percent: 0.52 },
+    { question: '问题 5', percent: 0.53 },
+    { question: '问题 6', percent: 0.84 },
+    { question: '问题 7', percent: 1.0 },
+    { question: '问题 8', percent: 1.2 },
+  ];
+  it('xField*yField', () => {
+    const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      appendPadding: 10,
-      data: [
-        { question: '问题 1', percent: 0.21 },
-        { question: '问题 2', percent: 0.4 },
-        { question: '问题 3', percent: 0.49 },
-        { question: '问题 4', percent: 0.52 },
-        { question: '问题 5', percent: 0.53 },
-        { question: '问题 6', percent: 0.84 },
-        { question: '问题 7', percent: 1.0 },
-        { question: '问题 8', percent: 1.2 },
-        { question: '问题 9', percent: 0.49 },
-        { question: '问题 10', percent: 0.52 },
-        { question: '问题 11', percent: 0.53 },
-        { question: '问题 12', percent: 0.84 },
-        { question: '问题 13', percent: 1.0 },
-        { question: '问题 14', percent: 1.2 },
-        { question: '问题 15', percent: 0.49 },
-        { question: '问题 16', percent: 0.52 },
-        { question: '问题 17', percent: 0.53 },
-        { question: '问题 18', percent: 0.84 },
-        { question: '问题 19', percent: 1.0 },
-        { question: '问题 20', percent: 1.2 },
-      ],
+      data,
       xField: 'question',
       yField: 'percent',
-      barStyle: {
-        fill: 'red',
-        fillOpacity: 0.6,
-        cursor: 'pointer',
-      },
-      color: '#BAE7FF-#1890FF-#0050B3',
-      tooltip: {
-        showTitle: false,
-        showCrosshairs: false,
-      },
-      xAxis: {
-        line: {
-          style: {
-            lineWidth: 1,
-            fill: 'red',
-          },
-        },
-      },
     });
-    radialBar.render();
+    bar.render();
+    const geometry = bar.chart.geometries[0];
+    const positionFields = geometry.getAttribute('position').getFields();
+    expect(geometry.type).toBe('interval');
+    expect(geometry.coordinate.type).toBe('polar');
+    expect(geometry.coordinate.innerRadius).toBe(0.1);
+    expect(geometry.coordinate.isTransposed).toBe(true);
+    expect(bar.chart.geometries[0].elements.length).toBe(data.length);
+    expect(positionFields).toHaveLength(2);
+    expect(positionFields[0]).toBe('question');
+    expect(positionFields[1]).toBe('percent');
+  });
+
+  it('xField*yField*color', () => {
+    const color = 'red';
+    const bar = new RadialBar(createDiv(), {
+      width: 400,
+      height: 300,
+      data,
+      xField: 'question',
+      yField: 'percent',
+      color,
+    });
+
+    bar.render();
+    const geometry = bar.chart.geometries[0];
+    const colorFields = geometry.getAttribute('color').getFields();
+    expect(colorFields).toHaveLength(1);
+    expect(colorFields[0]).toBe(color);
   });
 });
diff --git a/__tests__/unit/plots/radial-bar/style-spec.ts b/__tests__/unit/plots/radial-bar/style-spec.ts
index e69de29bb2..b4d5b3c848 100644
--- a/__tests__/unit/plots/radial-bar/style-spec.ts
+++ b/__tests__/unit/plots/radial-bar/style-spec.ts
@@ -0,0 +1,36 @@
+import { RadialBar } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+
+describe('radial-bar style', () => {
+  const data = [
+    { question: '问题 1', percent: 0.21 },
+    { question: '问题 2', percent: 0.4 },
+    { question: '问题 3', percent: 0.49 },
+    { question: '问题 4', percent: 0.52 },
+    { question: '问题 5', percent: 0.53 },
+    { question: '问题 6', percent: 0.84 },
+    { question: '问题 7', percent: 1.0 },
+    { question: '问题 8', percent: 1.2 },
+  ];
+  it('bar styles', () => {
+    const bar = new RadialBar(createDiv(), {
+      width: 400,
+      height: 300,
+      data,
+      xField: 'question',
+      yField: 'percent',
+      barStyle: {
+        fill: 'red',
+        fillOpacity: 0.6,
+        cursor: 'pointer',
+      },
+    });
+    bar.render();
+    const geometry = bar.chart.geometries[0];
+    expect(geometry.elements[0].getModel().style).toMatchObject({
+      fill: 'red',
+      fillOpacity: 0.6,
+      cursor: 'pointer',
+    });
+  });
+});
diff --git a/__tests__/unit/plots/radial-bar/tooltip-spec.ts b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
index e69de29bb2..0474527c8c 100644
--- a/__tests__/unit/plots/radial-bar/tooltip-spec.ts
+++ b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
@@ -0,0 +1,40 @@
+import { RadialBar } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+import { Datum } from '../../../../src/types';
+
+describe('radial-bar tooltip', () => {
+  const data = [
+    { question: '问题 1', percent: 0.21 },
+    { question: '问题 2', percent: 0.4 },
+    { question: '问题 3', percent: 0.49 },
+    { question: '问题 4', percent: 0.52 },
+    { question: '问题 5', percent: 0.53 },
+    { question: '问题 6', percent: 0.84 },
+    { question: '问题 7', percent: 1.0 },
+    { question: '问题 8', percent: 1.2 },
+  ];
+  const formatter = (datum: Datum) => {
+    return { name: '占比', value: datum.percent * 100 + '%' };
+  };
+  it('tooltip default', () => {
+    const bar = new RadialBar(createDiv(), {
+      width: 400,
+      height: 300,
+      data,
+      xField: 'question',
+      yField: 'percent',
+      tooltip: {
+        formatter,
+      },
+    });
+    bar.render();
+    // @ts-ignore
+    const tooltip = bar.chart.options.tooltip;
+    // @ts-ignore
+    expect(tooltip.showMarkers).toBe(false);
+    // @ts-ignore
+    expect(tooltip.title).toBe('question');
+    // @ts-ignore
+    expect(tooltip.formatter).toBe(formatter);
+  });
+});
diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index d329bce000..5e858045fc 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -1,6 +1,8 @@
+import { deepMix } from '@antv/util';
 import { interaction, animation, theme, scale, tooltip, legend } from '../../adaptor/common';
 import { Params } from '../../core/adaptor';
 import { flow } from '../../utils';
+import { interval } from '../../adaptor/geometries';
 import { RadialBarOptions } from './types';
 
 /**
@@ -9,15 +11,35 @@ import { RadialBarOptions } from './types';
  */
 function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { chart, options } = params;
-  const { data, xField, yField, barStyle, color } = options;
+  const { data, xField, yField, barStyle: style, color, tooltip } = options;
   chart.data(data);
-  const interval = chart.interval().position(`${xField}*${yField}`);
-  if (barStyle) {
-    interval.style(barStyle);
-  }
-  if (color) {
-    interval.color(`${yField}`, color);
-  }
+
+  // const interval = chart.interval().position(`${xField}*${yField}`);
+
+  // interval.tooltip(yField,(val)=>{
+  //   return {
+  //     name: '占比',
+  //     value: val * 100 + '%',
+  //   };
+  // });
+
+  // if (barStyle) {
+  //   interval.style(barStyle);
+  // }
+  // if (color) {
+  //   interval.color(`${yField}`, color);
+  // }
+
+  const p = deepMix({}, params, {
+    options: {
+      tooltip,
+      interval: {
+        style,
+        color,
+      },
+    },
+  });
+  interval(p);
   return params;
 }
 
@@ -77,17 +99,5 @@ export function axis(params: Params<RadialBarOptions>): Params<RadialBarOptions>
  * @param options
  */
 export function adaptor(params: Params<RadialBarOptions>) {
-  // flow 的方式处理所有的配置到 G2 API
-  return flow(
-    geometry,
-    meta,
-    axis,
-    coordinate,
-    interaction,
-    animation,
-    theme,
-    tooltip,
-    legend
-    // ... 其他的 adaptor flow
-  )(params);
+  return flow(geometry, meta, axis, coordinate, interaction, animation, theme, tooltip, legend)(params);
 }
diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index 712fa4cf4d..c08a56ee49 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -17,7 +17,7 @@ export class RadialBar extends Plot<RadialBarOptions> {
    * 获取默认配置
    */
   protected getDefaultOptions(options: RadialBarOptions) {
-    const { xField } = options;
+    const { xField, yField } = options;
     return deepMix({}, super.getDefaultOptions(), {
       interactions: [{ type: 'element-active' }],
       legend: false,
@@ -25,6 +25,7 @@ export class RadialBar extends Plot<RadialBarOptions> {
         title: xField,
         showMarkers: false,
       },
+      // seriesField: yField,
     });
   }
 
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index bba9adebdf..1e29583013 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -1,6 +1,5 @@
 import { ShapeAttrs } from '@antv/g-base/lib/types';
 import { Options } from '../../types';
-// import { ColumnOptions } from '../column/types';
 
 /** 配置类型定义 */
 export interface RadialBarOptions extends Options {

From 691c228ca2a1a11564df7a7d3c6c6d96e9212603 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Thu, 29 Oct 2020 17:59:00 +0800
Subject: [PATCH 04/15] feat: add maxRadian

---
 __tests__/unit/plots/radial-bar/axis-spec.ts  |  2 +-
 __tests__/unit/plots/radial-bar/index-spec.ts |  3 ++-
 __tests__/unit/plots/radial-bar/utils-spec.ts | 20 ++++++++++++++
 src/plots/radial-bar/adaptor.ts               | 26 +++++--------------
 src/plots/radial-bar/index.ts                 |  3 +--
 src/plots/radial-bar/types.ts                 |  2 ++
 src/plots/radial-bar/utils.ts                 | 10 +++++++
 7 files changed, 42 insertions(+), 24 deletions(-)
 create mode 100644 __tests__/unit/plots/radial-bar/utils-spec.ts
 create mode 100644 src/plots/radial-bar/utils.ts

diff --git a/__tests__/unit/plots/radial-bar/axis-spec.ts b/__tests__/unit/plots/radial-bar/axis-spec.ts
index c32aa842e2..2138f2579e 100644
--- a/__tests__/unit/plots/radial-bar/axis-spec.ts
+++ b/__tests__/unit/plots/radial-bar/axis-spec.ts
@@ -7,7 +7,7 @@ describe('radial-bar axis', () => {
     { question: '问题 2', percent: 0.4 },
     { question: '问题 3', percent: 0.49 },
     { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 0.53 },
+    { question: '问题 5', percent: 1.2 },
     { question: '问题 6', percent: 0.84 },
     { question: '问题 7', percent: 1.0 },
     { question: '问题 8', percent: 1.2 },
diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index dd09228cc9..dc7f27fc55 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -3,7 +3,7 @@ import { createDiv } from '../../../utils/dom';
 
 describe('radial-bar', () => {
   const data = [
-    { question: '问题 1', percent: 0.21 },
+    { question: '问题 1', percent: 0.2 },
     { question: '问题 2', percent: 0.4 },
     { question: '问题 3', percent: 0.49 },
     { question: '问题 4', percent: 0.52 },
@@ -19,6 +19,7 @@ describe('radial-bar', () => {
       data,
       xField: 'question',
       yField: 'percent',
+      maxRadian: 600,
     });
     bar.render();
     const geometry = bar.chart.geometries[0];
diff --git a/__tests__/unit/plots/radial-bar/utils-spec.ts b/__tests__/unit/plots/radial-bar/utils-spec.ts
new file mode 100644
index 0000000000..7c54f510a2
--- /dev/null
+++ b/__tests__/unit/plots/radial-bar/utils-spec.ts
@@ -0,0 +1,20 @@
+import { getScaleMax } from '../../../../src/plots/radial-bar/utils';
+
+describe('utils of radial-bar', () => {
+  const data = [
+    { question: '问题 1', percent: 0.2 },
+    { question: '问题 2', percent: 0.4 },
+    { question: '问题 3', percent: 0.49 },
+    { question: '问题 4', percent: 0.52 },
+    { question: '问题 5', percent: 0.53 },
+    { question: '问题 6', percent: 0.84 },
+    { question: '问题 7', percent: 1.0 },
+    { question: '问题 8', percent: 1.2 },
+  ];
+  it('getScaleMax: normal', () => {
+    expect(getScaleMax(null, 'percent', data)).toBe((1.2 * 360) / 240);
+    expect(getScaleMax(300, 'percent', data)).toBe((1.2 * 360) / 300);
+    expect(getScaleMax(-300, 'percent', data)).toBe((1.2 * 360) / 300);
+    expect(getScaleMax(660, 'percent', data)).toBe((1.2 * 360) / 300);
+  });
+});
diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index 5e858045fc..da613d8c39 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -4,6 +4,7 @@ import { Params } from '../../core/adaptor';
 import { flow } from '../../utils';
 import { interval } from '../../adaptor/geometries';
 import { RadialBarOptions } from './types';
+import { getScaleMax } from './utils';
 
 /**
  * geometry 处理
@@ -11,25 +12,8 @@ import { RadialBarOptions } from './types';
  */
 function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { chart, options } = params;
-  const { data, xField, yField, barStyle: style, color, tooltip } = options;
+  const { data, barStyle: style, color, tooltip } = options;
   chart.data(data);
-
-  // const interval = chart.interval().position(`${xField}*${yField}`);
-
-  // interval.tooltip(yField,(val)=>{
-  //   return {
-  //     name: '占比',
-  //     value: val * 100 + '%',
-  //   };
-  // });
-
-  // if (barStyle) {
-  //   interval.style(barStyle);
-  // }
-  // if (color) {
-  //   interval.color(`${yField}`, color);
-  // }
-
   const p = deepMix({}, params, {
     options: {
       tooltip,
@@ -49,13 +33,15 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  */
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { options } = params;
-  const { xField, yField } = options;
+  const { xField, yField, data, maxRadian } = options;
+  console.log(getScaleMax(maxRadian, yField, data));
   return flow(
     scale({
       [xField]: false,
       [yField]: {
         min: 0,
-        max: 2,
+        // max:2,
+        max: getScaleMax(maxRadian, yField, data),
       },
     })
   )(params);
diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index c08a56ee49..712fa4cf4d 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -17,7 +17,7 @@ export class RadialBar extends Plot<RadialBarOptions> {
    * 获取默认配置
    */
   protected getDefaultOptions(options: RadialBarOptions) {
-    const { xField, yField } = options;
+    const { xField } = options;
     return deepMix({}, super.getDefaultOptions(), {
       interactions: [{ type: 'element-active' }],
       legend: false,
@@ -25,7 +25,6 @@ export class RadialBar extends Plot<RadialBarOptions> {
         title: xField,
         showMarkers: false,
       },
-      // seriesField: yField,
     });
   }
 
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index 1e29583013..13f66019f2 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -9,4 +9,6 @@ export interface RadialBarOptions extends Options {
   readonly yField?: string;
   /** 样式 */
   readonly barStyle?: ShapeAttrs;
+  /** 最大弧度 */
+  readonly maxRadian?: number;
 }
diff --git a/src/plots/radial-bar/utils.ts b/src/plots/radial-bar/utils.ts
new file mode 100644
index 0000000000..83d64d71ff
--- /dev/null
+++ b/src/plots/radial-bar/utils.ts
@@ -0,0 +1,10 @@
+export function getScaleMax(maxRadian: number, yField: string, data: Record<string, any>[]): number {
+  const defaultMaxRadian = 240; // 默认最大弧度240度
+  const yData = data.map((item) => item[yField]);
+  const maxValue = Math.max(...yData);
+  if (maxRadian) {
+    const formatRadian = Math.abs(maxRadian) % 360;
+    return (maxValue * 360) / formatRadian;
+  }
+  return (maxValue * 360) / defaultMaxRadian;
+}

From 3f331d77d4bc381d86cd93344ce92431b5ce7e82 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Thu, 29 Oct 2020 18:33:08 +0800
Subject: [PATCH 05/15] feat: add radial bar docs

---
 docs/manual/plots/radial-bar.en.md | 70 ++++++++++++++++++++++++++++++
 docs/manual/plots/radial-bar.zh.md | 70 ++++++++++++++++++++++++++++++
 src/plots/radial-bar/types.ts      |  2 +-
 3 files changed, 141 insertions(+), 1 deletion(-)
 create mode 100644 docs/manual/plots/radial-bar.en.md
 create mode 100644 docs/manual/plots/radial-bar.zh.md

diff --git a/docs/manual/plots/radial-bar.en.md b/docs/manual/plots/radial-bar.en.md
new file mode 100644
index 0000000000..8302938464
--- /dev/null
+++ b/docs/manual/plots/radial-bar.en.md
@@ -0,0 +1,70 @@
+---
+title: 玉珏图
+order: 0
+---
+
+## 配置属性
+
+### 图表容器
+
+`markdown:docs/common/chart-options.zh.md`
+
+### 数据映射
+
+#### data 📌
+
+**必选**, _array object_
+
+功能描述： 设置图表数据源
+
+默认配置： 无
+
+数据源为对象集合，例如：`[{ time: '1991'，value: 20 }, { time: '1992'，value: 30 }]`。
+
+`markdown:docs/common/xy-field.zh.md`
+
+`markdown:docs/common/meta.zh.md`
+
+### 图形样式
+
+#### maxRadian
+
+**可选**, _number_
+
+功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+
+默认配置： 240
+
+#### color
+
+**可选**, _string_
+
+功能描述： 图形颜色。
+
+默认配置： 无
+
+```ts
+// 设置单一颜色
+{
+  color: '#a8ddb5'
+}
+// 设置多色（渐变色）
+{
+  color: '#BAE7FF-#1890FF-#0050B3',
+}
+
+```
+
+#### barStyle
+
+**可选**, _StyleAttr | Function_
+
+功能描述： 样式配置 。
+
+默认配置： 无
+
+`markdown:docs/common/shape-style.zh.md`
+
+### 图表组件
+
+`markdown:docs/common/component.zh.md`
diff --git a/docs/manual/plots/radial-bar.zh.md b/docs/manual/plots/radial-bar.zh.md
new file mode 100644
index 0000000000..8302938464
--- /dev/null
+++ b/docs/manual/plots/radial-bar.zh.md
@@ -0,0 +1,70 @@
+---
+title: 玉珏图
+order: 0
+---
+
+## 配置属性
+
+### 图表容器
+
+`markdown:docs/common/chart-options.zh.md`
+
+### 数据映射
+
+#### data 📌
+
+**必选**, _array object_
+
+功能描述： 设置图表数据源
+
+默认配置： 无
+
+数据源为对象集合，例如：`[{ time: '1991'，value: 20 }, { time: '1992'，value: 30 }]`。
+
+`markdown:docs/common/xy-field.zh.md`
+
+`markdown:docs/common/meta.zh.md`
+
+### 图形样式
+
+#### maxRadian
+
+**可选**, _number_
+
+功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+
+默认配置： 240
+
+#### color
+
+**可选**, _string_
+
+功能描述： 图形颜色。
+
+默认配置： 无
+
+```ts
+// 设置单一颜色
+{
+  color: '#a8ddb5'
+}
+// 设置多色（渐变色）
+{
+  color: '#BAE7FF-#1890FF-#0050B3',
+}
+
+```
+
+#### barStyle
+
+**可选**, _StyleAttr | Function_
+
+功能描述： 样式配置 。
+
+默认配置： 无
+
+`markdown:docs/common/shape-style.zh.md`
+
+### 图表组件
+
+`markdown:docs/common/component.zh.md`
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index 13f66019f2..50387eab95 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -9,6 +9,6 @@ export interface RadialBarOptions extends Options {
   readonly yField?: string;
   /** 样式 */
   readonly barStyle?: ShapeAttrs;
-  /** 最大弧度 */
+  /** 最大弧度 0~360 */
   readonly maxRadian?: number;
 }

From c871733796e331bd27375bdedde3b04976e89528 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Thu, 29 Oct 2020 19:34:13 +0800
Subject: [PATCH 06/15] feat: add example demo and api

---
 docs/manual/plots/radial-bar.en.md       | 21 +--------
 docs/manual/plots/radial-bar.zh.md       | 21 +--------
 examples/radial-bar/basic/API.en.md      | 55 ++++++++++++++++++++++++
 examples/radial-bar/basic/API.zh.md      | 55 ++++++++++++++++++++++++
 examples/radial-bar/basic/demo/basic.ts  | 29 +++++++++++++
 examples/radial-bar/basic/demo/meta.json | 16 +++++++
 examples/radial-bar/basic/design.en.md   |  5 +++
 examples/radial-bar/basic/design.zh.md   |  5 +++
 examples/radial-bar/basic/index.en.md    |  4 ++
 examples/radial-bar/basic/index.zh.md    |  4 ++
 gatsby-config.js                         |  8 ++++
 11 files changed, 185 insertions(+), 38 deletions(-)
 create mode 100644 examples/radial-bar/basic/API.en.md
 create mode 100644 examples/radial-bar/basic/API.zh.md
 create mode 100644 examples/radial-bar/basic/demo/basic.ts
 create mode 100644 examples/radial-bar/basic/demo/meta.json
 create mode 100644 examples/radial-bar/basic/design.en.md
 create mode 100644 examples/radial-bar/basic/design.zh.md
 create mode 100644 examples/radial-bar/basic/index.en.md
 create mode 100644 examples/radial-bar/basic/index.zh.md

diff --git a/docs/manual/plots/radial-bar.en.md b/docs/manual/plots/radial-bar.en.md
index 8302938464..e2635788fb 100644
--- a/docs/manual/plots/radial-bar.en.md
+++ b/docs/manual/plots/radial-bar.en.md
@@ -35,25 +35,6 @@ order: 0
 
 默认配置： 240
 
-#### color
-
-**可选**, _string_
-
-功能描述： 图形颜色。
-
-默认配置： 无
-
-```ts
-// 设置单一颜色
-{
-  color: '#a8ddb5'
-}
-// 设置多色（渐变色）
-{
-  color: '#BAE7FF-#1890FF-#0050B3',
-}
-
-```
 
 #### barStyle
 
@@ -65,6 +46,8 @@ order: 0
 
 `markdown:docs/common/shape-style.zh.md`
 
+`markdown:docs/common/color.en.md`
+
 ### 图表组件
 
 `markdown:docs/common/component.zh.md`
diff --git a/docs/manual/plots/radial-bar.zh.md b/docs/manual/plots/radial-bar.zh.md
index 8302938464..e2635788fb 100644
--- a/docs/manual/plots/radial-bar.zh.md
+++ b/docs/manual/plots/radial-bar.zh.md
@@ -35,25 +35,6 @@ order: 0
 
 默认配置： 240
 
-#### color
-
-**可选**, _string_
-
-功能描述： 图形颜色。
-
-默认配置： 无
-
-```ts
-// 设置单一颜色
-{
-  color: '#a8ddb5'
-}
-// 设置多色（渐变色）
-{
-  color: '#BAE7FF-#1890FF-#0050B3',
-}
-
-```
 
 #### barStyle
 
@@ -65,6 +46,8 @@ order: 0
 
 `markdown:docs/common/shape-style.zh.md`
 
+`markdown:docs/common/color.en.md`
+
 ### 图表组件
 
 `markdown:docs/common/component.zh.md`
diff --git a/examples/radial-bar/basic/API.en.md b/examples/radial-bar/basic/API.en.md
new file mode 100644
index 0000000000..e47b67d963
--- /dev/null
+++ b/examples/radial-bar/basic/API.en.md
@@ -0,0 +1,55 @@
+## 配置属性
+
+### 图表容器
+
+`markdown:docs/common/chart-options.en.md`
+
+### 数据映射
+
+#### data 📌
+
+**必选**, _array object_
+
+功能描述： 设置图表数据源
+
+默认配置： 无
+
+数据源为对象集合，例如：`[{ time: '1991'，value: 20 }, { time: '1992'，value: 20 }]`。
+
+`markdown:docs/common/meta.en.md`
+
+
+#### colorField 📌
+
+**可选**, _string_
+
+功能描述： 颜色映射对应的数据字段名。
+
+默认配置： 无
+
+### 图形样式
+
+#### maxRadian
+
+**可选**, _number_
+
+功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+
+默认配置： 240
+
+`markdown:docs/common/color.en.md`
+
+#### barStyle
+
+**可选**, _StyleAttr | Function_
+
+功能描述： 样式配置 。
+
+默认配置： 无
+
+`markdown:docs/common/shape-style.en.md`
+
+
+### 图表组件
+
+`markdown:docs/common/component-no-axis.en.md`
diff --git a/examples/radial-bar/basic/API.zh.md b/examples/radial-bar/basic/API.zh.md
new file mode 100644
index 0000000000..58ad3aea5d
--- /dev/null
+++ b/examples/radial-bar/basic/API.zh.md
@@ -0,0 +1,55 @@
+## 配置属性
+
+### 图表容器
+
+`markdown:docs/common/chart-options.zh.md`
+
+### 数据映射
+
+#### data 📌
+
+**必选**, _array object_
+
+功能描述： 设置图表数据源
+
+默认配置： 无
+
+数据源为对象集合，例如：`[{ time: '1991'，value: 20 }, { time: '1992'，value: 20 }]`。
+
+`markdown:docs/common/meta.zh.md`
+
+
+#### colorField 📌
+
+**可选**, _string_
+
+功能描述： 颜色映射对应的数据字段名。
+
+默认配置： 无
+
+### 图形样式
+
+#### maxRadian
+
+**可选**, _number_
+
+功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+
+默认配置： 240
+
+`markdown:docs/common/color.zh.md`
+
+#### barStyle
+
+**可选**, _StyleAttr | Function_
+
+功能描述： 样式配置 。
+
+默认配置： 无
+
+`markdown:docs/common/shape-style.zh.md`
+
+
+### 图表组件
+
+`markdown:docs/common/component-no-axis.zh.md`
diff --git a/examples/radial-bar/basic/demo/basic.ts b/examples/radial-bar/basic/demo/basic.ts
new file mode 100644
index 0000000000..60a1607f5b
--- /dev/null
+++ b/examples/radial-bar/basic/demo/basic.ts
@@ -0,0 +1,29 @@
+import { RadialBar } from '@antv/g2plot';
+
+const data = [
+  { question: '问题 1', percent: 0.21 },
+  { question: '问题 2', percent: 0.4 },
+  { question: '问题 3', percent: 0.49 },
+  { question: '问题 4', percent: 0.52 },
+  { question: '问题 5', percent: 0.53 },
+  { question: '问题 6', percent: 0.84 },
+  { question: '问题 7', percent: 1.0 },
+  { question: '问题 8', percent: 1.2 },
+];
+
+const bar = new RadialBar('container', {
+  width: 400,
+  height: 300,
+  data,
+  xField: 'question',
+  yField: 'percent',
+  // maxRadian: 90, //最大弧度,
+  colorField: 'percent',
+  color: ['#BAE7FF', '#1890FF', '#0050B3'],
+  tooltip: {
+    formatter: (datum) => {
+      return { name: '占比', value: datum.percent * 100 + '%' };
+    },
+  },
+});
+bar.render();
diff --git a/examples/radial-bar/basic/demo/meta.json b/examples/radial-bar/basic/demo/meta.json
new file mode 100644
index 0000000000..a95f5f5c84
--- /dev/null
+++ b/examples/radial-bar/basic/demo/meta.json
@@ -0,0 +1,16 @@
+{
+  "title": {
+    "zh": "中文分类",
+    "en": "Category"
+  },
+  "demos": [
+    {
+      "filename": "basic.ts",
+      "title": {
+        "zh": "玉珏图",
+        "en": "basic Radial-Bar chart"
+      },
+      "screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*wmldRZZj9lIAAAAAAAAAAABkARQnAQ"
+    }
+  ]
+}
diff --git a/examples/radial-bar/basic/design.en.md b/examples/radial-bar/basic/design.en.md
new file mode 100644
index 0000000000..39392da41f
--- /dev/null
+++ b/examples/radial-bar/basic/design.en.md
@@ -0,0 +1,5 @@
+---
+title: 设计规范
+---
+
+
diff --git a/examples/radial-bar/basic/design.zh.md b/examples/radial-bar/basic/design.zh.md
new file mode 100644
index 0000000000..39392da41f
--- /dev/null
+++ b/examples/radial-bar/basic/design.zh.md
@@ -0,0 +1,5 @@
+---
+title: 设计规范
+---
+
+
diff --git a/examples/radial-bar/basic/index.en.md b/examples/radial-bar/basic/index.en.md
new file mode 100644
index 0000000000..b7cc0cf982
--- /dev/null
+++ b/examples/radial-bar/basic/index.en.md
@@ -0,0 +1,4 @@
+---
+title: Radial-Bar
+order: 0
+---
diff --git a/examples/radial-bar/basic/index.zh.md b/examples/radial-bar/basic/index.zh.md
new file mode 100644
index 0000000000..b97fe20ad0
--- /dev/null
+++ b/examples/radial-bar/basic/index.zh.md
@@ -0,0 +1,4 @@
+---
+title: 玉珏图
+order: 0
+---
diff --git a/gatsby-config.js b/gatsby-config.js
index bb0ca52819..cbfdd6242b 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -264,6 +264,14 @@ module.exports = {
           en: 'Sunburst Charts',
         },
       },
+      {
+        slug: 'radial-bar',
+        icon: 'other',
+        title: {
+          zh: '玉珏图',
+          en: 'Radial Bar',
+        },
+      },
       // OTHERS
       {
         slug: 'general',

From 958da74de5a7817887d2564e5366fd74ecee15e8 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 10:16:59 +0800
Subject: [PATCH 07/15] feat: ajust RadialBar export position

---
 src/index.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index 4f17c6d6ca..fafca2442b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -88,6 +88,9 @@ export { Gauge, GaugeOptions } from './plots/gauge';
 // 瀑布图 | author by [hustcc](https://github.com/me-momo)
 export { Waterfall, WaterfallOptions } from './plots/waterfall';
 
+// 玉珏图 | author by [yujs](https://github.com/yujs)
+export { RadialBar } from './plots/radial-bar';
+
 // 以下开放自定义图表开发的能力（目前仅仅是孵化中）
 /** 所有开放图表都使用 G2Plot.P 作为入口开发，理论上官方的所有图表都可以走 G2Plot.P 的入口（暂时不处理） */
 export { P } from './plugin';
@@ -98,6 +101,3 @@ export { line, interval, area, point, polygon } from './adaptor/geometries';
 
 /** 对于没有开发完成的图表，可以暂时先放到 Lab 下面，先做体验，稳定后放到根 export */
 export { Lab } from './lab';
-
-// 玉珏图
-export { RadialBar } from './plots/radial-bar';

From 9b85c92b6fe13aaac317516405a382526ca1184e Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 10:26:16 +0800
Subject: [PATCH 08/15] feat: delete console log

---
 src/plots/radial-bar/adaptor.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index da613d8c39..f48d4371de 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -34,7 +34,6 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { options } = params;
   const { xField, yField, data, maxRadian } = options;
-  console.log(getScaleMax(maxRadian, yField, data));
   return flow(
     scale({
       [xField]: false,

From 825aeb57c72794e375570ed753accd6105b4e7ff Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 11:26:56 +0800
Subject: [PATCH 09/15] feat: add antV star data into test and demo

---
 __tests__/data/antv-star.ts                   | 10 ++++++
 __tests__/unit/plots/radial-bar/axis-spec.ts  | 24 ++++++--------
 __tests__/unit/plots/radial-bar/index-spec.ts | 32 ++++++++-----------
 __tests__/unit/plots/radial-bar/style-spec.ts | 20 ++++--------
 .../unit/plots/radial-bar/tooltip-spec.ts     | 24 ++++++--------
 __tests__/unit/plots/radial-bar/utils-spec.ts | 23 ++++++-------
 examples/radial-bar/basic/demo/basic.ts       | 24 +++++++-------
 7 files changed, 68 insertions(+), 89 deletions(-)
 create mode 100644 __tests__/data/antv-star.ts

diff --git a/__tests__/data/antv-star.ts b/__tests__/data/antv-star.ts
new file mode 100644
index 0000000000..d059e3740c
--- /dev/null
+++ b/__tests__/data/antv-star.ts
@@ -0,0 +1,10 @@
+export const antvStar = [
+  { name: 'X6', star: 297 },
+  { name: 'G', star: 506 },
+  { name: 'AVA', star: 805 },
+  { name: 'G2Plot', star: 1478 },
+  { name: 'L7', star: 2029 },
+  { name: 'F2', star: 7346 },
+  { name: 'G6', star: 7100 },
+  { name: 'G2', star: 10178 },
+];
diff --git a/__tests__/unit/plots/radial-bar/axis-spec.ts b/__tests__/unit/plots/radial-bar/axis-spec.ts
index 2138f2579e..d8c9351e10 100644
--- a/__tests__/unit/plots/radial-bar/axis-spec.ts
+++ b/__tests__/unit/plots/radial-bar/axis-spec.ts
@@ -1,24 +1,18 @@
 import { RadialBar } from '../../../../src';
 import { createDiv } from '../../../utils/dom';
+import { antvStar } from '../../../data/antv-star';
+
+const xField = 'name';
+const yField = 'star';
 
 describe('radial-bar axis', () => {
-  const data = [
-    { question: '问题 1', percent: 0.21 },
-    { question: '问题 2', percent: 0.4 },
-    { question: '问题 3', percent: 0.49 },
-    { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 1.2 },
-    { question: '问题 6', percent: 0.84 },
-    { question: '问题 7', percent: 1.0 },
-    { question: '问题 8', percent: 1.2 },
-  ];
   it('xAxis*yAxis', () => {
     const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      data,
-      xField: 'question',
-      yField: 'percent',
+      data: antvStar,
+      xField,
+      yField,
       xAxis: {
         line: {
           style: {
@@ -38,8 +32,8 @@ describe('radial-bar axis', () => {
     });
     bar.render();
     const axisOptions = bar.chart.getOptions().axes;
-    expect(axisOptions['percent']).toBeUndefined();
-    expect(axisOptions['question']).toMatchObject({
+    expect(axisOptions[yField]).toBeUndefined();
+    expect(axisOptions[xField]).toMatchObject({
       grid: null,
       line: null,
       tickLine: null,
diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index dc7f27fc55..415acd6f28 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -1,24 +1,18 @@
 import { RadialBar } from '../../../../src';
 import { createDiv } from '../../../utils/dom';
+import { antvStar } from '../../../data/antv-star';
+
+const xField = 'name';
+const yField = 'star';
 
 describe('radial-bar', () => {
-  const data = [
-    { question: '问题 1', percent: 0.2 },
-    { question: '问题 2', percent: 0.4 },
-    { question: '问题 3', percent: 0.49 },
-    { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 0.53 },
-    { question: '问题 6', percent: 0.84 },
-    { question: '问题 7', percent: 1.0 },
-    { question: '问题 8', percent: 1.2 },
-  ];
   it('xField*yField', () => {
     const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      data,
-      xField: 'question',
-      yField: 'percent',
+      data: antvStar,
+      xField,
+      yField,
       maxRadian: 600,
     });
     bar.render();
@@ -28,10 +22,10 @@ describe('radial-bar', () => {
     expect(geometry.coordinate.type).toBe('polar');
     expect(geometry.coordinate.innerRadius).toBe(0.1);
     expect(geometry.coordinate.isTransposed).toBe(true);
-    expect(bar.chart.geometries[0].elements.length).toBe(data.length);
+    expect(bar.chart.geometries[0].elements.length).toBe(antvStar.length);
     expect(positionFields).toHaveLength(2);
-    expect(positionFields[0]).toBe('question');
-    expect(positionFields[1]).toBe('percent');
+    expect(positionFields[0]).toBe(xField);
+    expect(positionFields[1]).toBe(yField);
   });
 
   it('xField*yField*color', () => {
@@ -39,9 +33,9 @@ describe('radial-bar', () => {
     const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      data,
-      xField: 'question',
-      yField: 'percent',
+      data: antvStar,
+      xField,
+      yField,
       color,
     });
 
diff --git a/__tests__/unit/plots/radial-bar/style-spec.ts b/__tests__/unit/plots/radial-bar/style-spec.ts
index b4d5b3c848..9cae16b6be 100644
--- a/__tests__/unit/plots/radial-bar/style-spec.ts
+++ b/__tests__/unit/plots/radial-bar/style-spec.ts
@@ -1,24 +1,18 @@
 import { RadialBar } from '../../../../src';
 import { createDiv } from '../../../utils/dom';
+import { antvStar } from '../../../data/antv-star';
+
+const xField = 'name';
+const yField = 'star';
 
 describe('radial-bar style', () => {
-  const data = [
-    { question: '问题 1', percent: 0.21 },
-    { question: '问题 2', percent: 0.4 },
-    { question: '问题 3', percent: 0.49 },
-    { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 0.53 },
-    { question: '问题 6', percent: 0.84 },
-    { question: '问题 7', percent: 1.0 },
-    { question: '问题 8', percent: 1.2 },
-  ];
   it('bar styles', () => {
     const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      data,
-      xField: 'question',
-      yField: 'percent',
+      data: antvStar,
+      xField,
+      yField,
       barStyle: {
         fill: 'red',
         fillOpacity: 0.6,
diff --git a/__tests__/unit/plots/radial-bar/tooltip-spec.ts b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
index 0474527c8c..a81a994299 100644
--- a/__tests__/unit/plots/radial-bar/tooltip-spec.ts
+++ b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
@@ -1,28 +1,22 @@
 import { RadialBar } from '../../../../src';
 import { createDiv } from '../../../utils/dom';
 import { Datum } from '../../../../src/types';
+import { antvStar } from '../../../data/antv-star';
+
+const xField = 'name';
+const yField = 'star';
 
 describe('radial-bar tooltip', () => {
-  const data = [
-    { question: '问题 1', percent: 0.21 },
-    { question: '问题 2', percent: 0.4 },
-    { question: '问题 3', percent: 0.49 },
-    { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 0.53 },
-    { question: '问题 6', percent: 0.84 },
-    { question: '问题 7', percent: 1.0 },
-    { question: '问题 8', percent: 1.2 },
-  ];
   const formatter = (datum: Datum) => {
-    return { name: '占比', value: datum.percent * 100 + '%' };
+    return { name: 'star', value: datum.percent * 100 + '%' };
   };
   it('tooltip default', () => {
     const bar = new RadialBar(createDiv(), {
       width: 400,
       height: 300,
-      data,
-      xField: 'question',
-      yField: 'percent',
+      data: antvStar,
+      xField,
+      yField,
       tooltip: {
         formatter,
       },
@@ -33,7 +27,7 @@ describe('radial-bar tooltip', () => {
     // @ts-ignore
     expect(tooltip.showMarkers).toBe(false);
     // @ts-ignore
-    expect(tooltip.title).toBe('question');
+    expect(tooltip.title).toBe(xField);
     // @ts-ignore
     expect(tooltip.formatter).toBe(formatter);
   });
diff --git a/__tests__/unit/plots/radial-bar/utils-spec.ts b/__tests__/unit/plots/radial-bar/utils-spec.ts
index 7c54f510a2..f3f82a4e7b 100644
--- a/__tests__/unit/plots/radial-bar/utils-spec.ts
+++ b/__tests__/unit/plots/radial-bar/utils-spec.ts
@@ -1,20 +1,15 @@
 import { getScaleMax } from '../../../../src/plots/radial-bar/utils';
+import { antvStar } from '../../../data/antv-star';
+
+const yField = 'star';
 
 describe('utils of radial-bar', () => {
-  const data = [
-    { question: '问题 1', percent: 0.2 },
-    { question: '问题 2', percent: 0.4 },
-    { question: '问题 3', percent: 0.49 },
-    { question: '问题 4', percent: 0.52 },
-    { question: '问题 5', percent: 0.53 },
-    { question: '问题 6', percent: 0.84 },
-    { question: '问题 7', percent: 1.0 },
-    { question: '问题 8', percent: 1.2 },
-  ];
+  const starArr = antvStar.map((item) => item[yField]);
+  const maxValue = Math.max(...starArr);
   it('getScaleMax: normal', () => {
-    expect(getScaleMax(null, 'percent', data)).toBe((1.2 * 360) / 240);
-    expect(getScaleMax(300, 'percent', data)).toBe((1.2 * 360) / 300);
-    expect(getScaleMax(-300, 'percent', data)).toBe((1.2 * 360) / 300);
-    expect(getScaleMax(660, 'percent', data)).toBe((1.2 * 360) / 300);
+    expect(getScaleMax(null, yField, antvStar)).toBe((maxValue * 360) / 240);
+    expect(getScaleMax(300, yField, antvStar)).toBe((maxValue * 360) / 300);
+    expect(getScaleMax(-300, yField, antvStar)).toBe((maxValue * 360) / 300);
+    expect(getScaleMax(660, yField, antvStar)).toBe((maxValue * 360) / 300);
   });
 });
diff --git a/examples/radial-bar/basic/demo/basic.ts b/examples/radial-bar/basic/demo/basic.ts
index 60a1607f5b..f4872321e5 100644
--- a/examples/radial-bar/basic/demo/basic.ts
+++ b/examples/radial-bar/basic/demo/basic.ts
@@ -1,28 +1,26 @@
 import { RadialBar } from '@antv/g2plot';
 
 const data = [
-  { question: '问题 1', percent: 0.21 },
-  { question: '问题 2', percent: 0.4 },
-  { question: '问题 3', percent: 0.49 },
-  { question: '问题 4', percent: 0.52 },
-  { question: '问题 5', percent: 0.53 },
-  { question: '问题 6', percent: 0.84 },
-  { question: '问题 7', percent: 1.0 },
-  { question: '问题 8', percent: 1.2 },
+  { name: 'X6', star: 297 },
+  { name: 'G', star: 506 },
+  { name: 'AVA', star: 805 },
+  { name: 'G2Plot', star: 1478 },
+  { name: 'L7', star: 2029 },
+  { name: 'F2', star: 7346 },
+  { name: 'G6', star: 7100 },
+  { name: 'G2', star: 10178 },
 ];
 
 const bar = new RadialBar('container', {
   width: 400,
   height: 300,
   data,
-  xField: 'question',
-  yField: 'percent',
+  xField: 'name',
+  yField: 'star',
   // maxRadian: 90, //最大弧度,
-  colorField: 'percent',
-  color: ['#BAE7FF', '#1890FF', '#0050B3'],
   tooltip: {
     formatter: (datum) => {
-      return { name: '占比', value: datum.percent * 100 + '%' };
+      return { name: 'star数', value: datum.star };
     },
   },
 });

From 97774a69f23700ceceeefd233232082660fbac94 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 11:45:51 +0800
Subject: [PATCH 10/15] feat: add radius and innerRadius

---
 __tests__/unit/plots/radial-bar/index-spec.ts | 2 ++
 src/plots/radial-bar/adaptor.ts               | 8 +++++---
 src/plots/radial-bar/types.ts                 | 4 ++++
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index 415acd6f28..0191dbd41e 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -14,6 +14,8 @@ describe('radial-bar', () => {
       xField,
       yField,
       maxRadian: 600,
+      radius: 0.8,
+      innerRadius: 0.2,
     });
     bar.render();
     const geometry = bar.chart.geometries[0];
diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index f48d4371de..ec59114b20 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -36,7 +36,6 @@ export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions>
   const { xField, yField, data, maxRadian } = options;
   return flow(
     scale({
-      [xField]: false,
       [yField]: {
         min: 0,
         // max:2,
@@ -51,12 +50,15 @@ export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions>
  * @param params
  */
 function coordinate(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
-  const { chart } = params;
+  const { chart, options } = params;
+  const { radius, innerRadius } = options;
+
   chart
     .coordinate({
       type: 'polar',
       cfg: {
-        innerRadius: 0.1,
+        radius,
+        innerRadius,
       },
     })
     .transpose();
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index 50387eab95..df970ecf97 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -11,4 +11,8 @@ export interface RadialBarOptions extends Options {
   readonly barStyle?: ShapeAttrs;
   /** 最大弧度 0~360 */
   readonly maxRadian?: number;
+  /** 圆半径 */
+  readonly radius?: number;
+  /** 圆内半径 */
+  readonly innerRadius?: number;
 }

From 591d479a4483ffe787c51177921f5f70f46497e7 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 11:50:21 +0800
Subject: [PATCH 11/15] feat: add radius and innerRadius docs

---
 docs/manual/plots/radial-bar.en.md  | 24 +++++++++++++++++++-----
 docs/manual/plots/radial-bar.zh.md  | 14 ++++++++++++++
 examples/radial-bar/basic/API.en.md | 15 +++++++++++++++
 examples/radial-bar/basic/API.zh.md | 15 +++++++++++++++
 4 files changed, 63 insertions(+), 5 deletions(-)

diff --git a/docs/manual/plots/radial-bar.en.md b/docs/manual/plots/radial-bar.en.md
index e2635788fb..26379c9f95 100644
--- a/docs/manual/plots/radial-bar.en.md
+++ b/docs/manual/plots/radial-bar.en.md
@@ -7,7 +7,7 @@ order: 0
 
 ### 图表容器
 
-`markdown:docs/common/chart-options.zh.md`
+`markdown:docs/common/chart-options.en.md`
 
 ### 数据映射
 
@@ -21,12 +21,26 @@ order: 0
 
 数据源为对象集合，例如：`[{ time: '1991'，value: 20 }, { time: '1992'，value: 30 }]`。
 
-`markdown:docs/common/xy-field.zh.md`
+`markdown:docs/common/xy-field.en.md`
 
-`markdown:docs/common/meta.zh.md`
+`markdown:docs/common/meta.en.md`
 
 ### 图形样式
 
+#### radius
+
+**可选**, _string_
+
+功能描述: 半径， 0 ~ 1。
+
+默认配置： `1`
+
+#### innerRadius
+
+**可选**, _number_;
+
+功能描述： 内径，0 ~ 1。
+
 #### maxRadian
 
 **可选**, _number_
@@ -44,10 +58,10 @@ order: 0
 
 默认配置： 无
 
-`markdown:docs/common/shape-style.zh.md`
+`markdown:docs/common/shape-style.en.md`
 
 `markdown:docs/common/color.en.md`
 
 ### 图表组件
 
-`markdown:docs/common/component.zh.md`
+`markdown:docs/common/component.en.md`
diff --git a/docs/manual/plots/radial-bar.zh.md b/docs/manual/plots/radial-bar.zh.md
index e2635788fb..2c7d10f669 100644
--- a/docs/manual/plots/radial-bar.zh.md
+++ b/docs/manual/plots/radial-bar.zh.md
@@ -27,6 +27,20 @@ order: 0
 
 ### 图形样式
 
+#### radius
+
+**可选**, _string_
+
+功能描述: 半径， 0 ~ 1。
+
+默认配置： `1`
+
+#### innerRadius
+
+**可选**, _number_;
+
+功能描述： 内径，0 ~ 1。
+
 #### maxRadian
 
 **可选**, _number_
diff --git a/examples/radial-bar/basic/API.en.md b/examples/radial-bar/basic/API.en.md
index e47b67d963..8900a02304 100644
--- a/examples/radial-bar/basic/API.en.md
+++ b/examples/radial-bar/basic/API.en.md
@@ -29,6 +29,21 @@
 
 ### 图形样式
 
+#### radius
+
+**可选**, _string_
+
+功能描述: 半径， 0 ~ 1。
+
+默认配置： `1`
+
+#### innerRadius
+
+**可选**, _number_;
+
+功能描述： 内径，0 ~ 1。
+
+
 #### maxRadian
 
 **可选**, _number_
diff --git a/examples/radial-bar/basic/API.zh.md b/examples/radial-bar/basic/API.zh.md
index 58ad3aea5d..abb3c33823 100644
--- a/examples/radial-bar/basic/API.zh.md
+++ b/examples/radial-bar/basic/API.zh.md
@@ -29,6 +29,21 @@
 
 ### 图形样式
 
+#### radius
+
+**可选**, _string_
+
+功能描述: 半径， 0 ~ 1。
+
+默认配置： `1`
+
+#### innerRadius
+
+**可选**, _number_;
+
+功能描述： 内径，0 ~ 1。
+
+
 #### maxRadian
 
 **可选**, _number_

From a91dcd75c8f9deba2bffd13e6259233a523c84ef Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 13:39:25 +0800
Subject: [PATCH 12/15] feat: modify xAxis default option

---
 src/plots/radial-bar/adaptor.ts | 10 +++-------
 src/plots/radial-bar/index.ts   |  5 +++++
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index ec59114b20..77961e0ea6 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -33,7 +33,7 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  */
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { options } = params;
-  const { xField, yField, data, maxRadian } = options;
+  const { yField, data, maxRadian } = options;
   return flow(
     scale({
       [yField]: {
@@ -71,12 +71,8 @@ function coordinate(params: Params<RadialBarOptions>): Params<RadialBarOptions>
  */
 export function axis(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { chart, options } = params;
-  const { xField } = options;
-  chart.axis(xField, {
-    grid: null,
-    tickLine: null,
-    line: null,
-  });
+  const { xField, xAxis } = options;
+  chart.axis(xField, xAxis);
   return params;
 }
 
diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index 712fa4cf4d..19c144ead2 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -25,6 +25,11 @@ export class RadialBar extends Plot<RadialBarOptions> {
         title: xField,
         showMarkers: false,
       },
+      xAxis: {
+        grid: null,
+        tickLine: null,
+        line: null,
+      },
     });
   }
 

From 74c41557ed76085876caa534aa9d91b6e2820b1a Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 13:42:27 +0800
Subject: [PATCH 13/15] feat: remove tooltip default title

---
 src/plots/radial-bar/index.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index 19c144ead2..f9ebc6c14b 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -22,7 +22,6 @@ export class RadialBar extends Plot<RadialBarOptions> {
       interactions: [{ type: 'element-active' }],
       legend: false,
       tooltip: {
-        title: xField,
         showMarkers: false,
       },
       xAxis: {

From 9e1488ec32c52082fed872ac2b5f733230a51a49 Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 15:44:45 +0800
Subject: [PATCH 14/15] feat: fixed some issues

---
 __tests__/unit/plots/radial-bar/axis-spec.ts    |  8 --------
 __tests__/unit/plots/radial-bar/index-spec.ts   |  5 +++--
 __tests__/unit/plots/radial-bar/tooltip-spec.ts |  2 --
 __tests__/unit/plots/radial-bar/utils-spec.ts   |  1 -
 docs/manual/plots/radial-bar.en.md              |  4 ++--
 docs/manual/plots/radial-bar.zh.md              |  4 ++--
 examples/radial-bar/basic/API.en.md             |  4 ++--
 examples/radial-bar/basic/API.zh.md             |  4 ++--
 examples/radial-bar/basic/demo/basic.ts         |  6 ++++--
 src/index.ts                                    |  2 +-
 src/plots/radial-bar/adaptor.ts                 |  5 ++---
 src/plots/radial-bar/index.ts                   |  4 ++--
 src/plots/radial-bar/types.ts                   |  4 ++--
 src/plots/radial-bar/utils.ts                   | 13 +++++++------
 14 files changed, 29 insertions(+), 37 deletions(-)

diff --git a/__tests__/unit/plots/radial-bar/axis-spec.ts b/__tests__/unit/plots/radial-bar/axis-spec.ts
index d8c9351e10..bbbf8bc320 100644
--- a/__tests__/unit/plots/radial-bar/axis-spec.ts
+++ b/__tests__/unit/plots/radial-bar/axis-spec.ts
@@ -13,14 +13,6 @@ describe('radial-bar axis', () => {
       data: antvStar,
       xField,
       yField,
-      xAxis: {
-        line: {
-          style: {
-            lineWidth: 1,
-            fill: 'red',
-          },
-        },
-      },
       yAxis: {
         line: {
           style: {
diff --git a/__tests__/unit/plots/radial-bar/index-spec.ts b/__tests__/unit/plots/radial-bar/index-spec.ts
index 0191dbd41e..ad1074daca 100644
--- a/__tests__/unit/plots/radial-bar/index-spec.ts
+++ b/__tests__/unit/plots/radial-bar/index-spec.ts
@@ -13,16 +13,16 @@ describe('radial-bar', () => {
       data: antvStar,
       xField,
       yField,
-      maxRadian: 600,
       radius: 0.8,
       innerRadius: 0.2,
+      xAxis: false,
     });
     bar.render();
     const geometry = bar.chart.geometries[0];
     const positionFields = geometry.getAttribute('position').getFields();
     expect(geometry.type).toBe('interval');
     expect(geometry.coordinate.type).toBe('polar');
-    expect(geometry.coordinate.innerRadius).toBe(0.1);
+    expect(geometry.coordinate.innerRadius).toBe(0.2);
     expect(geometry.coordinate.isTransposed).toBe(true);
     expect(bar.chart.geometries[0].elements.length).toBe(antvStar.length);
     expect(positionFields).toHaveLength(2);
@@ -39,6 +39,7 @@ describe('radial-bar', () => {
       xField,
       yField,
       color,
+      xAxis: false,
     });
 
     bar.render();
diff --git a/__tests__/unit/plots/radial-bar/tooltip-spec.ts b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
index a81a994299..c7730558ff 100644
--- a/__tests__/unit/plots/radial-bar/tooltip-spec.ts
+++ b/__tests__/unit/plots/radial-bar/tooltip-spec.ts
@@ -27,8 +27,6 @@ describe('radial-bar tooltip', () => {
     // @ts-ignore
     expect(tooltip.showMarkers).toBe(false);
     // @ts-ignore
-    expect(tooltip.title).toBe(xField);
-    // @ts-ignore
     expect(tooltip.formatter).toBe(formatter);
   });
 });
diff --git a/__tests__/unit/plots/radial-bar/utils-spec.ts b/__tests__/unit/plots/radial-bar/utils-spec.ts
index f3f82a4e7b..228d2c5858 100644
--- a/__tests__/unit/plots/radial-bar/utils-spec.ts
+++ b/__tests__/unit/plots/radial-bar/utils-spec.ts
@@ -7,7 +7,6 @@ describe('utils of radial-bar', () => {
   const starArr = antvStar.map((item) => item[yField]);
   const maxValue = Math.max(...starArr);
   it('getScaleMax: normal', () => {
-    expect(getScaleMax(null, yField, antvStar)).toBe((maxValue * 360) / 240);
     expect(getScaleMax(300, yField, antvStar)).toBe((maxValue * 360) / 300);
     expect(getScaleMax(-300, yField, antvStar)).toBe((maxValue * 360) / 300);
     expect(getScaleMax(660, yField, antvStar)).toBe((maxValue * 360) / 300);
diff --git a/docs/manual/plots/radial-bar.en.md b/docs/manual/plots/radial-bar.en.md
index 26379c9f95..4efa0baf18 100644
--- a/docs/manual/plots/radial-bar.en.md
+++ b/docs/manual/plots/radial-bar.en.md
@@ -41,11 +41,11 @@ order: 0
 
 功能描述： 内径，0 ~ 1。
 
-#### maxRadian
+#### maxAngle
 
 **可选**, _number_
 
-功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+功能描述： 最大旋转角度，由 data 中最大的数值决定，最大值是 360 度。
 
 默认配置： 240
 
diff --git a/docs/manual/plots/radial-bar.zh.md b/docs/manual/plots/radial-bar.zh.md
index 2c7d10f669..1d7f0e493c 100644
--- a/docs/manual/plots/radial-bar.zh.md
+++ b/docs/manual/plots/radial-bar.zh.md
@@ -41,11 +41,11 @@ order: 0
 
 功能描述： 内径，0 ~ 1。
 
-#### maxRadian
+#### maxAngle
 
 **可选**, _number_
 
-功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+功能描述： 最大旋转角度，由 data 中最大的数值决定，最大值是 360 度。
 
 默认配置： 240
 
diff --git a/examples/radial-bar/basic/API.en.md b/examples/radial-bar/basic/API.en.md
index 8900a02304..0abc22d0e9 100644
--- a/examples/radial-bar/basic/API.en.md
+++ b/examples/radial-bar/basic/API.en.md
@@ -44,11 +44,11 @@
 功能描述： 内径，0 ~ 1。
 
 
-#### maxRadian
+#### maxAngle
 
 **可选**, _number_
 
-功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+功能描述： 最大旋转角度，由 data 中最大的数值决定，最大值是 360 度。
 
 默认配置： 240
 
diff --git a/examples/radial-bar/basic/API.zh.md b/examples/radial-bar/basic/API.zh.md
index abb3c33823..cc63d3cb3a 100644
--- a/examples/radial-bar/basic/API.zh.md
+++ b/examples/radial-bar/basic/API.zh.md
@@ -44,11 +44,11 @@
 功能描述： 内径，0 ~ 1。
 
 
-#### maxRadian
+#### maxAngle
 
 **可选**, _number_
 
-功能描述： 最大弧度，由 data 中最大的数值决定，最大值是 360 度。
+功能描述： 最大旋转角度，由 data 中最大的数值决定，最大值是 360 度。
 
 默认配置： 240
 
diff --git a/examples/radial-bar/basic/demo/basic.ts b/examples/radial-bar/basic/demo/basic.ts
index f4872321e5..dc1b411e57 100644
--- a/examples/radial-bar/basic/demo/basic.ts
+++ b/examples/radial-bar/basic/demo/basic.ts
@@ -6,8 +6,8 @@ const data = [
   { name: 'AVA', star: 805 },
   { name: 'G2Plot', star: 1478 },
   { name: 'L7', star: 2029 },
-  { name: 'F2', star: 7346 },
   { name: 'G6', star: 7100 },
+  { name: 'F2', star: 7346 },
   { name: 'G2', star: 10178 },
 ];
 
@@ -17,7 +17,9 @@ const bar = new RadialBar('container', {
   data,
   xField: 'name',
   yField: 'star',
-  // maxRadian: 90, //最大弧度,
+  // maxAngle: 90, //最大旋转角度,
+  radius: 0.8,
+  innerRadius: 0.5,
   tooltip: {
     formatter: (datum) => {
       return { name: 'star数', value: datum.star };
diff --git a/src/index.ts b/src/index.ts
index fafca2442b..f572620d2d 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -89,7 +89,7 @@ export { Gauge, GaugeOptions } from './plots/gauge';
 export { Waterfall, WaterfallOptions } from './plots/waterfall';
 
 // 玉珏图 | author by [yujs](https://github.com/yujs)
-export { RadialBar } from './plots/radial-bar';
+export { RadialBar, RadialBarOptions } from './plots/radial-bar';
 
 // 以下开放自定义图表开发的能力（目前仅仅是孵化中）
 /** 所有开放图表都使用 G2Plot.P 作为入口开发，理论上官方的所有图表都可以走 G2Plot.P 的入口（暂时不处理） */
diff --git a/src/plots/radial-bar/adaptor.ts b/src/plots/radial-bar/adaptor.ts
index 77961e0ea6..5b0773f626 100644
--- a/src/plots/radial-bar/adaptor.ts
+++ b/src/plots/radial-bar/adaptor.ts
@@ -33,13 +33,12 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  */
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { options } = params;
-  const { yField, data, maxRadian } = options;
+  const { yField, data, maxAngle } = options;
   return flow(
     scale({
       [yField]: {
         min: 0,
-        // max:2,
-        max: getScaleMax(maxRadian, yField, data),
+        max: getScaleMax(maxAngle, yField, data),
       },
     })
   )(params);
diff --git a/src/plots/radial-bar/index.ts b/src/plots/radial-bar/index.ts
index f9ebc6c14b..1260f698eb 100644
--- a/src/plots/radial-bar/index.ts
+++ b/src/plots/radial-bar/index.ts
@@ -16,8 +16,7 @@ export class RadialBar extends Plot<RadialBarOptions> {
   /**
    * 获取默认配置
    */
-  protected getDefaultOptions(options: RadialBarOptions) {
-    const { xField } = options;
+  protected getDefaultOptions(): Partial<RadialBarOptions> {
     return deepMix({}, super.getDefaultOptions(), {
       interactions: [{ type: 'element-active' }],
       legend: false,
@@ -29,6 +28,7 @@ export class RadialBar extends Plot<RadialBarOptions> {
         tickLine: null,
         line: null,
       },
+      maxAngle: 240,
     });
   }
 
diff --git a/src/plots/radial-bar/types.ts b/src/plots/radial-bar/types.ts
index df970ecf97..92b0312935 100644
--- a/src/plots/radial-bar/types.ts
+++ b/src/plots/radial-bar/types.ts
@@ -9,8 +9,8 @@ export interface RadialBarOptions extends Options {
   readonly yField?: string;
   /** 样式 */
   readonly barStyle?: ShapeAttrs;
-  /** 最大弧度 0~360 */
-  readonly maxRadian?: number;
+  /** 最大旋转角度 0~360 */
+  readonly maxAngle?: number;
   /** 圆半径 */
   readonly radius?: number;
   /** 圆内半径 */
diff --git a/src/plots/radial-bar/utils.ts b/src/plots/radial-bar/utils.ts
index 83d64d71ff..ee59ab7be5 100644
--- a/src/plots/radial-bar/utils.ts
+++ b/src/plots/radial-bar/utils.ts
@@ -1,10 +1,11 @@
-export function getScaleMax(maxRadian: number, yField: string, data: Record<string, any>[]): number {
-  const defaultMaxRadian = 240; // 默认最大弧度240度
+import { Data } from '../../types';
+
+export function getScaleMax(maxAngle: number, yField: string, data: Data): number {
   const yData = data.map((item) => item[yField]);
   const maxValue = Math.max(...yData);
-  if (maxRadian) {
-    const formatRadian = Math.abs(maxRadian) % 360;
-    return (maxValue * 360) / formatRadian;
+  const formatRadian = Math.abs(maxAngle) % 360;
+  if (!formatRadian) {
+    return maxValue;
   }
-  return (maxValue * 360) / defaultMaxRadian;
+  return (maxValue * 360) / formatRadian;
 }

From 6b44ff444fd7ec4f1b777dcb2560ed73da80e22e Mon Sep 17 00:00:00 2001
From: yujs <1062888640@qq.com>
Date: Fri, 30 Oct 2020 15:46:50 +0800
Subject: [PATCH 15/15] feat: modify  demo innerRadius value

---
 examples/radial-bar/basic/demo/basic.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/radial-bar/basic/demo/basic.ts b/examples/radial-bar/basic/demo/basic.ts
index dc1b411e57..ab400b1671 100644
--- a/examples/radial-bar/basic/demo/basic.ts
+++ b/examples/radial-bar/basic/demo/basic.ts
@@ -19,7 +19,7 @@ const bar = new RadialBar('container', {
   yField: 'star',
   // maxAngle: 90, //最大旋转角度,
   radius: 0.8,
-  innerRadius: 0.5,
+  innerRadius: 0.2,
   tooltip: {
     formatter: (datum) => {
       return { name: 'star数', value: datum.star };