feat: add lab domain (#1765)

* feat: add lab domain

* feat(lab): add one case

__tests__/unit/lab-spec.ts

@@ -0,0 +1,26 @@
+import { Lab, notice, Stage } from '../../src/lab';
+import { RadialBar } from '../../src/plots/radial-bar';
+
+describe('lab', () => {
+  it('lab', () => {
+    expect(Lab.RadialBar).toBe(RadialBar);
+  });
+
+  it('notice', () => {
+    const fn = jest.fn();
+    window.console.warn = fn;
+
+    notice(Stage.DEV, 'Test');
+    expect(fn).toBeCalledWith(`Plot 'Test' is in DEV stage, just give us issues.`);
+
+    notice(Stage.BETA, 'X');
+    expect(fn).toBeCalledWith(`Plot 'X' is in BETA stage, DO NOT use it in production env.`);
+
+    notice(Stage.STABLE, 'Y');
+    expect(fn).toBeCalledWith(`Plot 'Y' is in STABLE stage, import it by "import { Y } from '@antv/g2'".`);
+
+    // @ts-ignore
+    notice('NO-STAGE', 'Y');
+    expect(fn).toBeCalledWith(`invalid Stage type.`);
+  });
+});

src/index.ts

@@ -95,3 +95,6 @@ export { P } from './plugin';
 export { flow } from './utils';
 /** 各个 geometry 的 adaptor，可以让开发者更快的构造图形 */
 export { line, interval, area, point, polygon } from './adaptor/geometries';
+
+/** 对于没有开发完成的图表，可以暂时先放到 Lab 下面，先做体验，稳定后放到根 export */
+export { Lab } from './lab';

src/lab.ts

@@ -0,0 +1,35 @@
+import { RadialBar } from './plots/radial-bar';
+
+/** 实验室图表所处的阶段 */
+export enum Stage {
+  DEV = 'DEV',
+  BETA = 'BETA',
+  STABLE = 'STABLE',
+}
+
+/**
+ * 不同阶段打印一些消息给开发者
+ * @param stage
+ */
+export function notice(stage: Stage, plotType: string) {
+  console.warn(
+    stage === Stage.DEV
+      ? `Plot '${plotType}' is in DEV stage, just give us issues.`
+      : stage === Stage.BETA
+      ? `Plot '${plotType}' is in BETA stage, DO NOT use it in production env.`
+      : stage === Stage.STABLE
+      ? `Plot '${plotType}' is in STABLE stage, import it by "import { ${plotType} } from '@antv/g2'".`
+      : 'invalid Stage type.'
+  );
+}
+
+/**
+ * 实验室图表，实验室中的图表分成不同的阶段。
+ */
+export class Lab {
+  /** 玉珏图 */
+  static get RadialBar() {
+    notice(Stage.DEV, 'RadialBar');
+    return RadialBar;
+  }
+}

src/plots/radial-bar/adaptor.ts

@@ -0,0 +1,51 @@
+import { interaction, animation, theme, scale } from '../../adaptor/common';
+import { Params } from '../../core/adaptor';
+import { flow } from '../../utils';
+import { RadialBarOptions } from './types';
+
+/**
+ * geometry 处理
+ * @param params
+ */
+function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
+  const { chart, options } = params;
+  const { data, xField, yField } = options;
+
+  chart.data(data);
+
+  chart.interval().position(`${xField}*${yField}`);
+
+  return params;
+}
+
+/**
+ * meta 配置
+ * @param params
+ */
+export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
+  const { options } = params;
+  const { xAxis, yAxis, xField, yField } = options;
+
+  return flow(
+    scale({
+      [xField]: xAxis,
+      [yField]: yAxis,
+    })
+  )(params);
+}
+/**
+ * 图适配器
+ * @param chart
+ * @param options
+ */
+export function adaptor(params: Params<RadialBarOptions>) {
+  // flow 的方式处理所有的配置到 G2 API
+  return flow(
+    geometry,
+    meta,
+    interaction,
+    animation,
+    theme
+    // ... 其他的 adaptor flow
+  )(params);
+}

src/plots/radial-bar/index.ts

@@ -0,0 +1,21 @@
+import { Plot } from '../../core/plot';
+import { Adaptor } from '../../core/adaptor';
+import { RadialBarOptions } from './types';
+import { adaptor } from './adaptor';
+
+export { RadialBarOptions };
+
+/**
+ * 玉珏图
+ */
+export class RadialBar extends Plot<RadialBarOptions> {
+  /** 图表类型 */
+  public type: string = 'radial-bar';
+
+  /**
+   * 获取适配器
+   */
+  protected getSchemaAdaptor(): Adaptor<RadialBarOptions> {
+    return adaptor;
+  }
+}

src/plots/radial-bar/types.ts

@@ -0,0 +1,9 @@
+import { Options } from '../../types';
+
+/** 配置类型定义 */
+export interface RadialBarOptions extends Options {
+  /** x 轴字段 */
+  readonly xField?: string;
+  /** y 轴字段 */
+  readonly yField?: string;
+}