# antvis/chart-visualization-skills architecture

> Architecture diagram of the GitHub repository antvis/chart-visualization-skills, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/antvis/chart-visualization-skills
- Repository: https://github.com/antvis/chart-visualization-skills

## Overview

Chart Visualization Skills is an AI-oriented visualization toolkit: users install or invoke a skill, which supplies library-specific guidance for generating charts, graphs, diagrams, infographics, or narrative visuals. A separate documentation retrieval interface searches the G2/G6/X6 reference corpus and returns matching material. The README describes the broader skill capabilities; sampled TypeScript supports the retrieval flow. The evaluation harness is omitted because it is auxiliary rather than a user-facing product subsystem.

Main entry points: [`src/retriever.ts`](https://github.com/antvis/chart-visualization-skills/blob/master/src/retriever.ts) (Document Search), [`src/context.ts`](https://github.com/antvis/chart-visualization-skills/blob/master/src/context.ts) (Context Index), [`skills/antv-g2-chart/SKILL.md`](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g2-chart/SKILL.md) (G2 Charts), [`skills/antv-g6-graph/SKILL.md`](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g6-graph/SKILL.md) (G6 Graphs)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_skills["Visualization Skills"]
  node_g2skill["G2 Charts<br/>[SKILL.md]"]
  node_g6skill["G6 Graphs<br/>[SKILL.md]"]
  node_x6skill["X6 Diagrams<br/>[SKILL.md]"]
  node_chartskill["Chart Selection<br/>[SKILL.md]"]
  node_gptvisskill["GPT-Vis<br/>[SKILL.md]"]
  node_infographic["Infographics<br/>[SKILL.md]"]
  node_t8skill["T8 Narratives<br/>[SKILL.md]"]
  node_iconskill["Icon Retrieval<br/>[SKILL.md]"]
end

subgraph group_content["Reference Corpus"]
  node_g2docs["G2 References"]
  node_g6docs["G6 References"]
  node_x6docs["X6 References"]
end

subgraph group_retrieval["Documentation Retrieval"]
  node_context[("Context Index<br/>[context.ts]")]
  node_synonyms["Query Expansion<br/>[synonyms.ts]"]
  node_retriever["Document Search<br/>[retriever.ts]"]
  node_token["Token Budget<br/>[token.ts]"]
end

subgraph group_interfaces["User Interfaces"]
  node_api["Programmatic API<br/>[api.ts]"]
  node_cli["Retrieve Command<br/>[retrieve.ts]"]
end

node_user(("User"))

node_user -->|"requests charts"| node_g2skill
node_user -->|"requests graphs"| node_g6skill
node_user -->|"requests diagrams"| node_x6skill
node_user -->|"requests visualization"| node_chartskill
node_user -->|"requests GPT-Vis"| node_gptvisskill
node_user -->|"requests infographic"| node_infographic
node_user -->|"requests narrative"| node_t8skill
node_user -->|"searches icons"| node_iconskill
node_user -->|"searches docs"| node_cli
node_cli -->|"calls retrieve"| node_retriever
node_api -->|"exposes retrieval"| node_retriever
node_retriever -->|"queries context"| node_context
node_retriever -->|"expands query"| node_synonyms
node_retriever -->|"applies budget"| node_token
node_context -->|"loads Markdown"| node_g2docs
node_context -->|"loads Markdown"| node_g6docs
node_context -->|"loads Markdown"| node_x6docs
node_g2skill -.->|"covers library"| node_g2docs
node_g6skill -.->|"covers library"| node_g6docs
node_x6skill -.->|"covers library"| node_x6docs

click node_g2skill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g2-chart/SKILL.md"
click node_g6skill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g6-graph/SKILL.md"
click node_x6skill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-x6-editor/SKILL.md"
click node_chartskill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/chart-visualization/SKILL.md"
click node_gptvisskill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-gpt-vis/SKILL.md"
click node_infographic "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-infographic/SKILL.md"
click node_t8skill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-t8-ntv/SKILL.md"
click node_iconskill "https://github.com/antvis/chart-visualization-skills/blob/master/skills/icon-retrieval/SKILL.md"
click node_g2docs "https://github.com/antvis/chart-visualization-skills/tree/master/src/content/g2"
click node_g6docs "https://github.com/antvis/chart-visualization-skills/tree/master/src/content/g6"
click node_x6docs "https://github.com/antvis/chart-visualization-skills/tree/master/src/content/x6"
click node_context "https://github.com/antvis/chart-visualization-skills/blob/master/src/context.ts"
click node_synonyms "https://github.com/antvis/chart-visualization-skills/blob/master/src/synonyms.ts"
click node_retriever "https://github.com/antvis/chart-visualization-skills/blob/master/src/retriever.ts"
click node_token "https://github.com/antvis/chart-visualization-skills/blob/master/src/token.ts"
click node_api "https://github.com/antvis/chart-visualization-skills/blob/master/src/api.ts"
click node_cli "https://github.com/antvis/chart-visualization-skills/blob/master/src/commands/retrieve.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_g2skill,node_g6skill,node_x6skill,node_chartskill,node_gptvisskill,node_infographic,node_t8skill,node_iconskill,node_user toneBlue
class node_g2docs,node_g6docs,node_x6docs toneAmber
class node_context,node_synonyms,node_retriever,node_token toneMint
class node_api,node_cli toneRose
```

## Components

### Visualization Skills

- [G2 Charts](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g2-chart/SKILL.md): `skills/antv-g2-chart/SKILL.md`
- [G6 Graphs](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-g6-graph/SKILL.md): `skills/antv-g6-graph/SKILL.md`
- [X6 Diagrams](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-x6-editor/SKILL.md): `skills/antv-x6-editor/SKILL.md`
- [Chart Selection](https://github.com/antvis/chart-visualization-skills/blob/master/skills/chart-visualization/SKILL.md): `skills/chart-visualization/SKILL.md`
- [GPT-Vis](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-gpt-vis/SKILL.md): `skills/antv-gpt-vis/SKILL.md`
- [Infographics](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-infographic/SKILL.md): `skills/antv-infographic/SKILL.md`
- [T8 Narratives](https://github.com/antvis/chart-visualization-skills/blob/master/skills/antv-t8-ntv/SKILL.md): `skills/antv-t8-ntv/SKILL.md`
- [Icon Retrieval](https://github.com/antvis/chart-visualization-skills/blob/master/skills/icon-retrieval/SKILL.md): `skills/icon-retrieval/SKILL.md`

### Reference Corpus

- [G2 References](https://github.com/antvis/chart-visualization-skills/tree/master/src/content/g2): `src/content/g2`
- [G6 References](https://github.com/antvis/chart-visualization-skills/tree/master/src/content/g6): `src/content/g6`
- [X6 References](https://github.com/antvis/chart-visualization-skills/tree/master/src/content/x6): `src/content/x6`

### Documentation Retrieval

- [Context Index](https://github.com/antvis/chart-visualization-skills/blob/master/src/context.ts): `src/context.ts`
- [Query Expansion](https://github.com/antvis/chart-visualization-skills/blob/master/src/synonyms.ts): `src/synonyms.ts`
- [Document Search](https://github.com/antvis/chart-visualization-skills/blob/master/src/retriever.ts): `src/retriever.ts`
- [Token Budget](https://github.com/antvis/chart-visualization-skills/blob/master/src/token.ts): `src/token.ts`

### User Interfaces

- [Programmatic API](https://github.com/antvis/chart-visualization-skills/blob/master/src/api.ts): `src/api.ts`
- [Retrieve Command](https://github.com/antvis/chart-visualization-skills/blob/master/src/commands/retrieve.ts): `src/commands/retrieve.ts`

### Other components

- **User**

## Connections

- User → G2 Charts: requests charts (evidence: `README.md`)
- User → G6 Graphs: requests graphs (evidence: `README.md`)
- User → X6 Diagrams: requests diagrams (evidence: `README.md`)
- User → Chart Selection: requests visualization (evidence: `README.md`)
- User → GPT-Vis: requests GPT-Vis (evidence: `README.md`)
- User → Infographics: requests infographic (evidence: `README.md`)
- User → T8 Narratives: requests narrative (evidence: `README.md`)
- User → Icon Retrieval: searches icons (evidence: `README.md`)
- User → Retrieve Command: searches docs (evidence: `src/commands/retrieve.ts`)
- Retrieve Command → Document Search: calls retrieve (evidence: `src/commands/retrieve.ts`)
- Programmatic API → Document Search: exposes retrieval (evidence: `src/api.ts`)
- Document Search → Context Index: queries context (evidence: `src/retriever.ts`)
- Document Search → Query Expansion: expands query (evidence: `src/retriever.ts`)
- Document Search → Token Budget: applies budget (evidence: `src/retriever.ts`)
- Context Index → G2 References: loads Markdown (evidence: `src/context.ts`)
- Context Index → G6 References: loads Markdown (evidence: `src/context.ts`)
- Context Index → X6 References: loads Markdown (evidence: `src/context.ts`)
- G2 Charts → G2 References: covers library (evidence: `README.md`)
- G6 Graphs → G6 References: covers library (evidence: `README.md`)
- X6 Diagrams → X6 References: covers library (evidence: `README.md`)