技术拆解-AVA

运行

注意:AVA 依赖了过期版本的 SSL,起动可能会报错:

Error: error:0308010C:digital envelope routines::unsupported

需要按照这个回答设置下:

1
2
3
4
5
6
7
8
# On Unix-like (Linux, macOS, Git bash, etc.):
export NODE_OPTIONS=--openssl-legacy-provider

# On Windows command prompt:
set NODE_OPTIONS=--openssl-legacy-provider

# On Windows PowerShell:
$env:NODE_OPTIONS = "--openssl-legacy-provider"

结构

AVA contains 2 packages, @antv/ava and @antv/ava-react :

@antv/ava : AVA core package, containing four main modules:

data (Data Processing): Data Processing Module. Used for statistical analysis and processing of datasets.
insight (Auto Insight): Automatic Insights Module. Automatically discover data insights from multi-dimensional data.
ckb (Chart Knowledge Base): Chart Knowledge Base Module. Based on empirically derived knowledge and observations about the various fundamentals of visualization and charts, it is the cornerstone of intelligent chart recommendations.
advisor (Chart Recommendation): Chart Recommendation Module. Recommend chart types and specific chart detail settings based on data and analysis needs, as well as chart optimization for existing charts.
@antv/ava-react : A plug-and-play React component library based on the integration of AVA capabilities, it contains three core components:

: Demonstrate data insight interpretation text. In a full-flow presentation of data analysis, using text to describe data phenomena is as critical as giving insightful conclusions.
: Present data insights in a combination of graphics and text. It is possible to either receive data directly and perform insights automatically, or to visualize and interpret only the insight result data for presentation.
>: Automatically recommends and renders the appropriate chart based on the data. It provides users with the ability to implement intelligent visualizations in one line of code, and the component is currently undergoing further upgrades.

data (Data Processing)

insight (Auto Insight)

ckb (Chart Knowledge Base)

advisor (Chart Recommendation)

graph TD
  A[Start] --> B[Initialize Options]
  B --> C[Get Chart ID Options]
  C --> D[Initialize Log and List]
  D --> E[For Each Chart ID]
  E --> F[Score Rules for Chart ID]
  F --> G[Score > 0?]
  G -- No --> H[Skip Chart ID]
  G -- Yes --> I[Get Chart Type Spec]
  I --> J[Is Custom Chart Type?]
  J -- Yes --> K[Skip Chart ID]
  J -- No --> L[Apply Design Rules?]
  L -- Yes --> M[Apply Design Rules]
  L -- No --> N[Apply Theme or Smart Color]
  N --> O[Add to List]
  O --> P[End For Each]
  P --> Q[Filter and Sort List]
  Q --> R[Return Result]

  subgraph Options Initialization
      B --> B1[enableRefine]
      B --> B2[smartColorOn]
      B --> B3[theme]
      B --> B4[requireSpec]
      B --> B5[ChartWIKI]
  end

  subgraph Score Rules
      F --> F1[scoreRules Function]
  end

  subgraph Get Chart Type Spec
      I --> I1[getChartTypeSpec Function]
  end

  subgraph Apply Design Rules
      M --> M1[applyDesignRules Function]
  end

  subgraph Apply Theme or Smart Color
      N --> N1[Apply Theme?]
      N1 -- Yes --> N2[applyTheme Function]
      N1 -- No --> N3[applySmartColor Function]
  end

  subgraph Filter and Sort List
      Q --> Q1[Filter by Score > 0]
      Q --> Q2[Sort by Score]
  end

Chart Knowledge Base

图表特征:
https://github.com/antvis/AVA/blob/master/packages/ava/src/ckb/base.ts

图表分类/设计原则:
https://github.com/antvis/AVA/blob/master/packages/ava/src/ckb/constants.ts

Rule Base

https://github.com/antvis/AVA/blob/master/packages/ava/src/advisor/ruler/types.ts#L101/

资料

https://github.com/antvis/AVA