MCP server overview
MCP Server Chart

A Model Context Protocol server for generating charts using AntV.
<a href=โhttps://www.star-history.com/#antvis/mcp-server-chart&Dateโ> <img width=โ512โ src=โhttps://api.star-history.com/svg?repos=antvis/mcp-server-chart&type=Dateโ /> </a>
This is a TypeScript-based MCP server that provides chart generation capabilities. It allows you to create various types of charts through MCP tools. You can also use it in Dify.
โจ Features
Now 15+ charts supported.
<img width=โ640โ alt=โmcp-server-chart previewโ src=โhttps://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZlzKQKoJzsYAAAAAAAAAAAAAemJ7AQ/fmt.webpโ />
generate_area_chart- Generate aareachart, and return an image URL.generate_bar_chart- Generate abarchart, and return an image URL.generate_column_chart- Generate acolumnchart, and return an image URL.generate_dual_axes_chart- Generate adual-axeschart, and return an image URL.generate_fishbone_diagram- Generate afishbone-diagramchart, and return an image URL.generate_flow_diagram- Generate aflow-diagramchart, and return an image URL.generate_histogram_chart- Generate ahistogramchart, and return an image URL.generate_line_chart- Generate alinechart, and return an image URL.generate_mind_map- Generate amind-mapchart, and return an image URL.generate_network_graph- Generate anetwork-graphchart, and return an image URL.generate_pie_chart- Generate apiechart, and return an image URL.generate_radar_chart- Generate aradarchart, and return an image URL.generate_scatter_chart- Generate ascatterchart, and return an image URL.generate_treemap_chart- Generate atreemapchart, and return an image URL.generate_word_cloud_chart- Generate aword-cloudchart, and return an image URL.
๐ค Usage
To use with Desktop APP, such as Claude, VSCode, Cline, Cherry Studio, Cursor, and so on, add the MCP server config below. On Mac system:
{
"mcpServers": {
"mcp-server-chart": {
"command": "npx",
"args": [
"-y",
"@antv/mcp-server-chart"
]
}
}
}
On Window system:
{
"mcpServers": {
"mcp-server-chart": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@antv/mcp-server-chart"
]
}
}
}
Also, you can use it on aliyun, modelscope, glama.ai, smithery.ai or others with HTTP, SSE Protocol.
๐ฐ Run with SSE or Streamable transport
Install the package globally.
npm install -g @antv/mcp-server-chart
Run the server with your preferred transport option:
# For SSE transport (default endpoint: /sse)
mcp-server-chart --transport sse
# For Streamable transport with custom endpoint
mcp-server-chart --transport streamable
Then you can access the server at:
- SSE transport:
http://localhost:1122/sse - Streamable transport:
http://localhost:1122/mcp
๐ฎ CLI Options
You can also use the following CLI options when running the MCP server. Command options by run cli with -h.
MCP Server Chart CLI
Options:
--transport, -t Specify the transport protocol: "stdio", "sse", or "streamable" (default: "stdio")
--port, -p Specify the port for SSE or streamable transport (default: 1122)
--endpoint, -e Specify the endpoint for the transport:
- For SSE: default is "/sse"
- For streamable: default is "/mcp"
--help, -h Show this help message
๐ Private Deployment
MCP Server Chart provides a free chart generation service by default. For users with a need for private deployment, they can try using VIS_REQUEST_SERVER to customize their own chart generation service.
{
"mcpServers": {
"mcp-server-chart": {
"command": "npx",
"args": [
"-y",
"@antv/mcp-server-chart"
],
"env": {
"VIS_REQUEST_SERVER": "<YOUR_VIS_REQUEST_SERVER>"
}
}
}
}
You can use AntVโs project GPT-Vis-SSR to deploy an HTTP service in a private environment, and then pass the URL address through env VIS_REQUEST_SERVER.
๐จ Development
Install dependencies:
npm install
Build the server:
npm run build
Start the MCP server:
npm run start
๐ License
MIT@AntV.