chart-visualization

Please visualize the data as charts based on the user's input.

Steps

1. Analyze the user's data and needs, and choose the most suitable chart type
2. Construct a JSON request body that conforms to the specification
3. Use the curl tool to call the API to generate a chart image
4. Output the returned image URL in Markdown image format

Chart Selection Guide

Based on the user's data characteristics and needs, choose the most suitable chart type:

• Time series: use line(trend) or area(cumulative trend); for two different dimensions use dual-axes
• Comparison: use bar(horizontal categorical comparison) or column(vertical categorical comparison); for frequency distribution use histogram
• Proportion: use pie(proportional composition) or treemap(hierarchical proportion)
• Relationships and processes: use scatter(correlation),sankey(flow direction) or venn(set overlap)
• Hierarchy and tree: use organization-chart or mind-map
• Specialized types：
  • radar: multi-dimensional comparison
  • funnel: process stage conversion
  • liquid: percentage/progress
  • word-cloud: text word frequency
  • boxplot / violin: statistical distribution
  • network-graph: complex node relationships
  • fishbone-diagram: causal analysis
  • flow-diagram: flowchart
  • spreadsheet: structured data table or pivot table

API Interface

POST https://antv-studio.alipay.com/api/gpt-vis

The request body is JSON and must include the type and source: "chart-visualization-skills" fields.

Example:

curl -X POST https://antv-studio.alipay.com/api/gpt-vis \
  -H "Content-Type: application/json" \
  -d '{"type":"line","source":"chart-visualization-skills","data":[{"time":"2025-01","value":100}],"title":"示例图表"}'

Return example:

{"success":true,"resultObj":"https://..."}

Output the URL in resultObj in Markdown image format:![图表](URL)

Supported Chart Types

Category	Chart Type
Comparison	Bar chart (bar), column chart (column), waterfall chart (waterfall), dual-axis chart (dual-axes)
Trend	Area chart (area), line chart (line), scatter chart (scatter)
Distribution	Box plot (boxplot), histogram (histogram), violin plot (violin), funnel chart (funnel)
Proportion	Pie chart (pie), liquid chart (liquid), word cloud (word-cloud)
Hierarchy	Organization chart (organization-chart), mind map (mind-map), treemap (treemap), Sankey diagram (sankey)
Relationship	Network graph (network-graph), Venn diagram (venn)
Process	Flow diagram (flow-diagram), fishbone diagram (fishbone-diagram)
Multi-dimensional	Radar chart (radar)
Table	Table/pivot table (spreadsheet)

Common Optional Parameters

Parameter	Type	Default Value	Description
theme	string	"default"	Theme: "default" / "academy" / "dark"
width	number	600	Chart width
height	number	400	Chart height
title	string	""	Chart title
style.texture	string	"default"	Texture: "default" / "rough" (hand-drawn style)

Charts with axes also support: axisXTitle, axisYTitle.

Data format for each chart

• area / line: {time: string, value: number, group?: string}[], optional stack: boolean
• bar: {category: string, value: number, group?: string}[], optional group / stack (default stack: true)
• column: {category: string, value: number, group?: string}[], optional group (default true) / stack
• scatter: {x: number, y: number, group?: string}[]
• pie: {category: string, value: number}[], optional innerRadius: number (0-1)
• radar: {name: string, value: number, group?: string}[]
• funnel: {category: string, value: number}[]
• waterfall: {category: string, value?: number, isTotal?: boolean, isIntermediateTotal?: boolean}[]
• dual-axes: categories: string[], series: {type: "column"|"line", data: number[], axisYTitle?: string}[]
• histogram: number[], optional binNumber: number
• boxplot / violin: {category: string, value: number, group?: string}[]
• liquid: percent: number (0-1), optional shape: "circle"|"rect"|"pin"|"triangle"
• word-cloud: {text: string, value: number}[]
• sankey: {source: string, target: string, value: number}[], optional nodeAlign
• treemap: {name: string, value: number, children?: ...}[] (maximum 3 levels deep)
• venn: {sets: string[], value: number, label?: string}[]
• network-graph / flow-diagram: {nodes: {name: string}[], edges: {source: string, target: string, name?: string}[]}
• fishbone-diagram / mind-map: {name: string, children?: ...} (maximum 3 levels deep)
• organization-chart: {name: string, description?: string, children?: ...} (maximum 3 levels deep), optional orient: "horizontal"|"vertical"
• spreadsheet: Record<string, string | number>[], optional rows / columns / values (pivot table fields)