A Model Context Protocol server for generating charts using AntV.
This is a TypeScript-based MCP server that provides chart generation capabilities. It allows you to create various types of charts through MCP tools.
✨ Features
Now 15+ charts supported.
generate_area_chart - Generate a area chart, and return an image URL.generate_bar_chart - Generate a bar chart, and return an image URL.generate_column_chart - Generate a column chart, and return an image URL.generate_dual_axes_chart - Generate a dual-axes chart, and return an image URL.generate_fishbone_diagram - Generate a fishbone-diagram chart, and return an image URL.generate_flow_diagram - Generate a flow-diagram chart, and return an image URL.generate_histogram_chart - Generate a histogram chart, and return an image URL.generate_line_chart - Generate a line chart, and return an image URL.generate_mind_map - Generate a mind-map chart, and return an image URL.generate_network_graph - Generate a network-graph chart, and return an image URL.generate_pie_chart - Generate a pie chart, and return an image URL.generate_radar_chart - Generate a radar chart, and return an image URL.generate_scatter_chart - Generate a scatter chart, and return an image URL.generate_treemap_chart - Generate a treemap chart, and return an image URL.generate_word_cloud_chart - Generate a word-cloud chart, and return an image URL.
? Usage
To use with Claude Desktop, add the server config:
{
"mcpServers": {
"mcp-server-chart": {
"command": "npx",
"args": [
"-y",
"@antv/mcp-server-chart"
]
}
}
}
? Development
Install dependencies:
npm install
Build the server:
npm run build
Start the MCP server:
npm run start
? License
MIT@AntV.
[
{
"description": "Generate a line chart to show trends over time, such as the ratio of Apple computer sales to Apple's profits changed from 2000 to 2016.",
"inputSchema": {
"properties": {
"axisXTitle": {
"description": "Set the x-axis title of chart.",
"type": "string"
},
"axisYTitle": {
"description": "Set the y-axis title of chart.",
"type": "string"
},
"data": {
"description": "Data for line chart, such as, [{time: string, value: string}].",
"items": {
"properties": {
"time": {
"type": "string"
},
"value": {
"type": "number"
}
},
"type": "objec"
},
"type": "array"
},
"title": {
"description": "Set the chart title.",
"type": "string"
}
},
"required": [
"data"
],
"type": "object"
},
"name": "generate_line_chart"
},
{
"description": "Generate a column chart, which are best for comparing categorical data, such as when values are close, column charts are preferable because our eyes are better at judging height than other visual elements like area or angles.",
"inputSchema": {
"properties": {
"axisXTitle": {
"description": "Set the x-axis title of chart.",
"type": "string"
},
"axisYTitle": {
"description": "Set the y-axis title of chart.",
"type": "string"
},
"data": {
"description": "data for column chart, such as, [{category: string; value: number; group?: string}].",
"items": {
"properties": {
"category": {
"type": "string"
},
"group": {
"type": "string"
},
"value": {
"type": "number"
}
},
"required": [
"category",
"value"
],
"type": "object"
},
"type": "array"
},
"group": {
"description": "grouping is enabled. column charts require a 'group' field in the data.",
"type": "boolean"
},
"stack": {
"description": "stacking is enabled. column charts require a 'group' field in the data.",
"type": "boolean"
},
"title": {
"description": "Set the chart title.",
"type": "string"
}
},
"required": [
"data"
],
"type": "object"
},
"name": "generate_column_chart"
},
{
"description": "Generate a pie chart to show the proportion of parts, such as market share and budget allocation.",
"inputSchema": {
"properties": {
"axisXTitle": {
"description": "Set the x-axis title of chart.",
"type": "string"
},
"axisYTitle": {
"description": "Set the y-axis title of chart.",
"type": "string"
},
"data": {
"description": "data for pie chart, (such as, [{category: string; value: number }])",
"items": {
"properties": {
"category": {
"type": "string"
},
"value": {
"type": "number"
}
},
"required": [
"category",
"value"
],
"type": "object"
},
"type": "array"
},
"innerRadius": {
"default": 0,
"description": "Set the pie chart as a donut chart. Set the value to 0.6 to enable it.",
"type": "number"
},
"title": {
"description": "Set the chart title.",
"type": "string"
}
},
"required": [
"data"
],
"type": "object"
},
"name": "generate_pie_chart"
},
{
"description": "Generate a area chart to show data trends under continuous independent variables and observe the overall data trend, such as displacement = velocity (average or instantaneous) × time: s = v × t. If the x-axis is time (t) and the y-axis is velocity (v) at each moment, an area chart allows you to observe the trend of velocity over time and infer the distance traveled by the area's size.",
"inputSchema": {
"properties": {
"axisXTitle": {
"description": "Set the x-axis title of chart.",
"type": "string"
},
"axisYTitle": {
"description": "Set the y-axis title of chart.",
"type": "string"
},
"data": {
"description": "data for pie chart, such as, [{time: string; value: number }].",
"items": {
"properties": {
"group": {
"type": "string"
},
"time": {
"type": "string"
},
"value": {
"type": "number"
}
},
"required": [
"time",
"value"
],
"type": "object"
},
"type": "array"
},
"stack": {
"description": "stacking is enabled. column charts require a 'group' field in the data.",
"type": "boolean"
},
"title": {
"description": "Set the chart title.",
"type": "string"
}
},
"required": [
"data"
],
"type": "object"
},
"name": "generate_area_chart"
}
]