refactor(ava/advisor): init new advisor pipeline & built-in modules to plugin-based architecture

packages/ava/__tests__/unit/advisor/index.test.ts

@@ -13,7 +13,7 @@ const myRule: RuleModule = {
   },
   trigger: (args) => {
     const { chartType } = args;
-    return ['pie_chart'].includes(chartType);
+    return ['pie_chart'].includes(chartType!);
   },
   validator: (args) => {
     let result = 1;
@@ -61,8 +61,8 @@ describe('init Advisor', () => {
 
   test('data to advices with ckb config custom chart', () => {
     const splitAngleColor = (dataProps: BasicDataPropertyForAdvice[]) => {
-      const field4Color = dataProps.find((field) => hasSubset(field.levelOfMeasurements, ['Nominal']));
-      const field4Angle = dataProps.find((field) => hasSubset(field.levelOfMeasurements, ['Interval']));
+      const field4Color = dataProps.find((field) => hasSubset(field.levelOfMeasurements!, ['Nominal']));
+      const field4Angle = dataProps.find((field) => hasSubset(field.levelOfMeasurements!, ['Interval']));
       return [field4Color, field4Angle];
     };
 

packages/ava/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/ava",
-  "version": "3.4.1",
+  "version": "3.5.0-alpha.1",
   "description": "A framework for automated visual analytics.",
   "author": {
     "name": "AntV",
@@ -55,14 +55,15 @@
   },
   "dependencies": {
     "@antv/antv-spec": "^0.1.0-alpha.18",
+    "@antv/color-schema": "^0.2.3",
     "@antv/g2": "^5.0.8",
     "@antv/smart-color": "^0.2.1",
-    "@antv/color-schema": "^0.2.3",
     "bayesian-changepoint": "^1.0.1",
     "csstype": "^3.1.2",
     "heap-js": "^2.1.6",
     "lodash": "^4.17.21",
     "regression": "^2.0.1",
+    "tapable": "^2.2.1",
     "tslib": "^2.3.1"
   },
   "devDependencies": {

packages/ava/src/advisor/advise-pipeline/data-to-advices.ts

@@ -1,16 +1,17 @@
 import { cloneDeep, deepMix } from '../utils';
 
-import { getChartTypeSpec } from './spec-generator';
+import { getChartTypeSpec } from './plugin/presets/spec-generator';
 import { DEFAULT_COLOR } from './constants';
-import { getChartTypeRecommendations } from './get-chart-Type';
-import { applyTheme, applyDesignRules, applySmartColor } from './spec-processors';
-import { getDataProps, getSelectedData } from './data-processors';
+import { getChartTypeRecommendations } from './plugin/presets/chart-type-recommend/get-chart-Type';
+import { applyTheme, applyDesignRules, applySmartColor } from './plugin/presets/spec-generator/spec-processors';
+import { getDataProps, getSelectedData } from './plugin/presets/data-processors';
 
 import type { ScoringResultForChartType, Advice, AdviseResult, ChartAdviseParams } from '../types';
 import type { RuleModule } from '../ruler/types';
 import type { ChartKnowledgeBase } from '../../ckb';
 
 /**
+ * @deprecated 已改造为 plugin 插件形式，之前的硬编码形式函数后续清理掉
  * recommending charts given data and dataProps, based on CKB and RuleBase
  *
  * @param params input params for charts recommending
@@ -46,7 +47,12 @@ export function dataToAdvices({
   const list: Advice[] = chartTypeRecommendations.map((result) => {
     // step 2: generate spec for each chart type
     const { score, chartType } = result;
-    const chartTypeSpec = getChartTypeSpec(chartType, filteredData, dataProps, ckb[chartType]);
+    const chartTypeSpec = getChartTypeSpec({
+      chartType,
+      data: filteredData,
+      dataProps,
+      chartKnowledge: ckb[chartType],
+    });
 
     // step 3: apply spec processors such as design rules, theme, color, to improve spec
     if (chartTypeSpec && refine) {

packages/ava/src/advisor/advise-pipeline/index.ts

@@ -1,3 +1,3 @@
 export * from './data-to-advices';
-export * from './spec-generator';
-export * from './data-processors';
+export * from './plugin/presets/spec-generator';
+export * from './plugin/presets/data-processors';

packages/ava/src/advisor/advise-pipeline/plugin/index.ts

@@ -0,0 +1 @@
+export * from './presets';

packages/ava/src/advisor/advise-pipeline/get-chart-Type.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/chart-type-recommend/get-chart-Type.ts

@@ -1,22 +1,30 @@
-import { compareAdvices, scoreRules } from './score-calculator';
+import { compareAdvices, scoreRules } from '../../../score-calculator';
 
-import type { ChartKnowledge } from '../../ckb';
-import type { ScoringResultForChartType, BasicDataPropertyForAdvice, RuleModule, AdvisorOptions } from '../types';
+import type { ChartKnowledge } from '../../../../../ckb';
+import type {
+  ScoringResultForChartType,
+  BasicDataPropertyForAdvice,
+  RuleModule,
+  AdvisorOptions,
+  AdvisorPipelineContext,
+} from '../../../../types';
 
 export const getChartTypeRecommendations = ({
   chartWIKI,
   dataProps,
   ruleBase,
   options,
+  advisorContext,
 }: {
   dataProps: BasicDataPropertyForAdvice[];
   chartWIKI: Record<string, ChartKnowledge>;
   ruleBase: Record<string, RuleModule>;
   options?: AdvisorOptions;
+  advisorContext?: Pick<AdvisorPipelineContext, 'extra'>;
 }) => {
   const chatTypes = Object.keys(chartWIKI);
   const list: ScoringResultForChartType[] = chatTypes.map((chartType) => {
-    return scoreRules(chartType, chartWIKI, dataProps, ruleBase, options);
+    return scoreRules(chartType, chartWIKI, dataProps, ruleBase, options, advisorContext);
   });
 
   // filter and sorter

packages/ava/src/advisor/advise-pipeline/plugin/presets/chart-type-recommend/index.ts

@@ -0,0 +1,2 @@
+export * from './get-chart-Type';
+export { chartTypeRecommendPlugin } from './plugin-config';

packages/ava/src/advisor/advise-pipeline/plugin/presets/chart-type-recommend/plugin-config.ts

@@ -0,0 +1,25 @@
+import { getChartTypeRecommendations } from './get-chart-Type';
+
+import type {
+  AdvisorPipelineContext,
+  ChartTypeRecommendInput,
+  ChartTypeRecommendOutput,
+  AdvisorPluginType,
+} from '../../../../types';
+
+export const chartTypeRecommendPlugin: AdvisorPluginType<ChartTypeRecommendInput, ChartTypeRecommendOutput> = {
+  name: 'defaultChartTypeRecommend',
+  stage: ['chartTypeRecommend'],
+  execute(input: ChartTypeRecommendInput, context?: AdvisorPipelineContext): ChartTypeRecommendOutput {
+    const { dataProps } = input;
+    const { advisor, options, extra } = context || {};
+    const chartTypeRecommendations = getChartTypeRecommendations({
+      dataProps,
+      chartWIKI: advisor.ckb,
+      ruleBase: advisor.ruleBase,
+      options,
+      advisorContext: { extra },
+    });
+    return { chartTypeRecommendations };
+  },
+};

packages/ava/src/advisor/advise-pipeline/data-processors/get-data-properties.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/data-processors/get-data-properties.ts

@@ -1,7 +1,7 @@
-import { DataFrame } from '../../../data';
+import { DataFrame } from '../../../../../data';
 
-import type { Data } from '../../../common/types';
-import type { BasicDataPropertyForAdvice } from '../../types';
+import type { Data } from '../../../../../common/types';
+import type { BasicDataPropertyForAdvice } from '../../../../types';
 
 /**
  * A utility function that assemble dataProps with user input and DataFrame

packages/ava/src/advisor/advise-pipeline/data-processors/get-selected-data.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/data-processors/get-selected-data.ts

@@ -1,4 +1,4 @@
-import { Data } from '../../../common/types';
+import { Data } from '../../../../../common/types';
 
 /** filter out fields that are not included for advising */
 export const getSelectedData = ({ data, fields }: { data: Data; fields?: string[] }) => {

packages/ava/src/advisor/advise-pipeline/data-processors/index.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/data-processors/index.ts

@@ -1,2 +1,3 @@
 export * from './get-data-properties';
 export * from './get-selected-data';
+export { dataProcessorPlugin } from './plugin-config';

packages/ava/src/advisor/advise-pipeline/plugin/presets/data-processors/plugin-config.ts

@@ -0,0 +1,27 @@
+import { cloneDeep } from 'lodash';
+
+import { getDataProps } from './get-data-properties';
+import { getSelectedData } from './get-selected-data';
+
+import type {
+  AdvisorPipelineContext,
+  DataProcessorInput,
+  DataProcessorOutput,
+  AdvisorPluginType,
+} from '../../../../types';
+
+export const dataProcessorPlugin: AdvisorPluginType<DataProcessorInput, DataProcessorOutput> = {
+  name: 'defaultDataProcessor',
+  stage: ['dataAnalyze'],
+  execute: (input: DataProcessorInput, context: AdvisorPipelineContext): DataProcessorOutput => {
+    const { data, customDataProps } = input;
+    const { fields } = context?.options || {};
+    const copyData = cloneDeep(data);
+    const dataProps = getDataProps(copyData, fields, customDataProps);
+    const filteredData = getSelectedData({ data: copyData, fields });
+    return {
+      data: filteredData,
+      dataProps,
+    };
+  },
+};

packages/ava/src/advisor/advise-pipeline/plugin/presets/index.ts

@@ -0,0 +1,4 @@
+export * from './chart-type-recommend';
+export * from './data-processors';
+export * from './spec-generator';
+export * from './visual-encoder';

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/area.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/area.ts

@@ -1,8 +1,9 @@
-import { hasSubset, intersects } from '../../../utils';
-import { splitAreaXYSeries } from '../splitFields';
+import { hasSubset, intersects } from '../../../../../utils';
+import { splitAreaXYSeries } from '../../visual-encoder/split-fields';
+import { getLineSize } from '../../visual-encoder/utils';
 
-import type { Data } from '../../../../common/types';
-import type { Advice, BasicDataPropertyForAdvice } from '../../../types';
+import type { Data, Datum } from '../../../../../../common/types';
+import type { Advice, BasicDataPropertyForAdvice } from '../../../../../types';
 
 export function areaChart(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const field4X = dataProps.find((field) => intersects(field.levelOfMeasurements, ['Time', 'Ordinal']));
@@ -16,6 +17,10 @@ export function areaChart(data: Data, dataProps: BasicDataPropertyForAdvice[]):
     encode: {
       x: field4X.name,
       y: field4Y.name,
+      size: (datum: Datum) => getLineSize(datum, data, { field4X }),
+    },
+    legend: {
+      size: false,
     },
   };
 
@@ -33,6 +38,10 @@ export function stackedAreaChart(data: Data, dataProps: BasicDataPropertyForAdvi
       x: field4X.name,
       y: field4Y.name,
       color: field4Series.name,
+      size: (datum: Datum) => getLineSize(datum, data, { field4Split: field4Series, field4X }),
+    },
+    legend: {
+      size: false,
     },
     transform: [{ type: 'stackY' }],
   };

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/bar.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/bar.ts

@@ -1,7 +1,7 @@
-import { splitBarXYSeries } from '../splitFields';
+import { splitBarXYSeries } from '../../visual-encoder/split-fields';
 
-import type { Data } from '../../../../common/types';
-import type { Advice, BasicDataPropertyForAdvice } from '../../../types';
+import type { Data } from '../../../../../../common/types';
+import type { Advice, BasicDataPropertyForAdvice } from '../../../../../types';
 
 export function barChart(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const [field4X, field4Y, field4Color] = splitBarXYSeries(dataProps);

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/column.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/column.ts

@@ -1,7 +1,7 @@
-import { Data } from '../../../../common/types';
-import { Advice, BasicDataPropertyForAdvice } from '../../../types';
-import { compare, hasSubset } from '../../../utils';
-import { splitColumnXYSeries } from '../splitFields';
+import { Data } from '../../../../../../common/types';
+import { Advice, BasicDataPropertyForAdvice } from '../../../../../types';
+import { compare, hasSubset } from '../../../../../utils';
+import { splitColumnXYSeries } from '../../visual-encoder/split-fields';
 
 export function columnChart(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const nominalFields = dataProps.filter((field) => hasSubset(field.levelOfMeasurements, ['Nominal']));

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/heatmap.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/heatmap.ts

@@ -1,7 +1,7 @@
-import { intersects, compare, hasSubset } from '../../../utils';
+import { intersects, compare, hasSubset } from '../../../../../utils';
 
-import type { Data } from '../../../../common/types';
-import type { BasicDataPropertyForAdvice, Advice } from '../../../types';
+import type { Data } from '../../../../../../common/types';
+import type { BasicDataPropertyForAdvice, Advice } from '../../../../../types';
 
 export function heatmap(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const axisFields = dataProps.filter((field) => intersects(field.levelOfMeasurements, ['Nominal', 'Ordinal']));

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/histogram.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/histogram.ts

@@ -1,7 +1,7 @@
-import { hasSubset } from '../../../utils';
+import { hasSubset } from '../../../../../utils';
 
-import type { Data } from '../../../../common/types';
-import type { BasicDataPropertyForAdvice, Advice } from '../../../types';
+import type { Data } from '../../../../../../common/types';
+import type { BasicDataPropertyForAdvice, Advice } from '../../../../../types';
 
 export function histogram(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const field = dataProps.find((field) => hasSubset(field.levelOfMeasurements, ['Interval']));

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/line.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/line.ts

@@ -1,7 +1,8 @@
-import { splitLineXY } from '../splitFields';
+import { splitLineXY } from '../../visual-encoder/split-fields';
+import { getLineSize } from '../../visual-encoder/utils';
 
-import type { Data } from '../../../../common/types';
-import type { Advice, BasicDataPropertyForAdvice } from '../../../types';
+import type { Data, Datum } from '../../../../../../common/types';
+import type { Advice, BasicDataPropertyForAdvice } from '../../../../../types';
 
 export function lineChart(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const [field4X, field4Y, field4Color] = splitLineXY(dataProps);
@@ -13,6 +14,10 @@ export function lineChart(data: Data, dataProps: BasicDataPropertyForAdvice[]):
     encode: {
       x: field4X.name,
       y: field4Y.name,
+      size: (datum: Datum) => getLineSize(datum, data, { field4X }),
+    },
+    legend: {
+      size: false,
     },
   };
 
@@ -34,6 +39,10 @@ export function stepLineChart(data: Data, dataProps: BasicDataPropertyForAdvice[
       x: field4X.name,
       y: field4Y.name,
       shape: 'hvh',
+      size: (datum: Datum) => getLineSize(datum, data, { field4X }),
+    },
+    legend: {
+      size: false,
     },
   };
 

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/pie.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/pie.ts

@@ -1,7 +1,7 @@
-import { splitAngleColor } from '../splitFields';
+import { splitAngleColor } from '../../visual-encoder/split-fields';
 
-import type { Data } from '../../../../common/types';
-import type { Advice, BasicDataPropertyForAdvice } from '../../../types';
+import type { Data } from '../../../../../../common/types';
+import type { Advice, BasicDataPropertyForAdvice } from '../../../../../types';
 
 export function pieChart(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const [field4Color, field4Angle] = splitAngleColor(dataProps);

packages/ava/src/advisor/advise-pipeline/spec-generator/charts/scatter.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/charts/scatter.ts

@@ -1,8 +1,8 @@
-import { pearson } from '../../../../data';
-import { hasSubset, compare, intersects } from '../../../utils';
+import { pearson } from '../../../../../../data';
+import { hasSubset, compare, intersects } from '../../../../../utils';
 
-import type { BasicDataPropertyForAdvice, Advice } from '../../../types';
-import type { Data } from '../../../../common/types';
+import type { BasicDataPropertyForAdvice, Advice } from '../../../../../types';
+import type { Data } from '../../../../../../common/types';
 
 export function scatterPlot(data: Data, dataProps: BasicDataPropertyForAdvice[]): Advice['spec'] {
   const intervalFields = dataProps.filter((field) => hasSubset(field.levelOfMeasurements, ['Interval']));

packages/ava/src/advisor/advise-pipeline/spec-generator/index.ts → packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/get-chart-spec.ts

@@ -1,4 +1,4 @@
-import { CHART_IDS } from '../../../ckb';
+import { CHART_IDS } from '../../../../../ckb';
 
 import {
   pieChart,
@@ -22,9 +22,10 @@ import {
   histogram,
 } from './charts';
 
-import type { Data } from '../../../common/types';
-import type { ChartId, ChartKnowledge } from '../../../ckb';
-import type { BasicDataPropertyForAdvice } from '../../ruler';
+import type { Data } from '../../../../../common/types';
+import type { ChartId, ChartKnowledge } from '../../../../../ckb';
+import type { BasicDataPropertyForAdvice } from '../../../../ruler';
+import type { Advice } from '../../../../types';
 
 /**
  * Convert chartType + data to antv-spec
@@ -36,12 +37,17 @@ import type { BasicDataPropertyForAdvice } from '../../ruler';
  * @param chartKnowledge chart knowledge of a singble chart
  * @returns spec or null
  */
-export function getChartTypeSpec(
-  chartType: string,
-  data: Data,
-  dataProps: BasicDataPropertyForAdvice[],
-  chartKnowledge?: ChartKnowledge
-) {
+export function getChartTypeSpec({
+  chartType,
+  data,
+  dataProps,
+  chartKnowledge,
+}: {
+  chartType: string;
+  data: Data;
+  dataProps: BasicDataPropertyForAdvice[];
+  chartKnowledge?: ChartKnowledge;
+}): Advice['spec'] {
   // step 0: check whether the chartType is default in `ChartId`
   // if not, use customized `toSpec` function
   if (!CHART_IDS.includes(chartType as ChartId) && chartKnowledge) {

packages/ava/src/advisor/advise-pipeline/plugin/presets/spec-generator/index.ts

@@ -0,0 +1,2 @@
+export { getChartTypeSpec } from './get-chart-spec';
+export { specGeneratorPlugin } from './plugin-config';