MCP Server Chart

一个用于使用 AntV 生成图表的模型上下文协议服务器。我们可以使用这个 mcp 服务器进行图表生成和数据分析 。

这是一个基于 TypeScript 的 MCP 服务器，提供了图表生成能力。您可以通过 MCP 工具创建各种类型的图表。您也可以在[Dify]中使用它。

  📋 目录

•   ✨ 功能
•   🤖 使用方法
• 运行时使用 SSE 或 Streamable 运输
•   命令行选项
• 环境变量
  • VIS_REQUEST_SERVER
  • SERVICE_ID
  • DISABLED_TOOLS
•    📠 私有部署
•    🗺️ 生成记录
•   🛠️ 工具筛选
•   🔨 开发
•   📄 许可证

  ✨ 功能

现在支持 25+ 种图表。

1. generate_area_chart: 生成一个 面积 图表，用于显示连续独立变量下的数据趋势，便于观察整体数据趋势。
2. generate_bar_chart: 生成一个 条形 图表，用于比较不同类别的值，适用于水平比较。
3. generate_boxplot_chart: 生成一个 箱线图 ，用于显示数据分布，包括中位数、四分位数和异常值。
4. generate_column_chart: 生成一个柱状图 ，用于比较不同类别之间的值，适用于垂直比较。
5. generate_district_map - 生成一个行政区划图 ，用于展示行政区域和数据分布。
6. generate_dual_axes_chart: 生成一个双轴图 ，用于显示两个具有不同单位或范围的变量之间的关系。
7. generate_fishbone_diagram: 生成一个鱼骨图 ，也称为石川图，用于识别和展示问题的根本原因。
8. generate_flow_diagram: 生成一个流程图 ，用于展示过程中的步骤和顺序。
9. generate_funnel_chart: 生成一个漏斗图 ，用于展示不同阶段的数据流失情况。
10. generate_histogram_chart: 生成一个直方图 ，用于通过将数据分为区间并计算每个区间中的数据点数量来展示数据的分布情况。
11. generate_line_chart: 生成一个折线图 ，用于展示数据随时间或其他连续变量的变化趋势。
12. generate_liquid_chart: 生成一个 liquid 图表，用于显示数据的比例，以水填充的球体形式可视化百分比。
13. generate_mind_map: 生成一个 思维导图 ，用于展示思维过程和层级信息。
14. generate_network_graph: 生成一个网络图，用于显示节点之间的关系和连接。
15. generate_organization_chart: 生成一个组织结构图，用于展示组织结构和人员关系。
16. generate_path_map - 生成一个 path-map，用于显示 POI 的路线规划结果。
17. generate_pie_chart: 生成一个 饼图 ，用于显示数据的比例，将其分为由表示各部分百分比的扇区组成的部分。
18. generate_pin_map - 生成一个 pin-map，用于展示 POI 的分布。
19. generate_radar_chart: Generate a radar chart, used to display multi-dimensional data comprehensively, showing multiple dimensions in a radar-like format.
20. generate_sankey_chart: Generate a sankey chart, used to display data flow and volume, representing the movement of data between different nodes in a Sankey-style format.
21. generate_scatter_chart: Generate a scatter plot, used to display the relationship between two variables, showing data points as scattered dots on a coordinate system.
22. generate_treemap_chart: Generate a treemap, used to display hierarchical data, showing data in rectangular forms where the size of rectangles represents the value of the data.
23. generate_venn_chart: Generate a venn diagram, used to display relationships between sets, including intersections, unions, and differences.
24. generate_violin_chart: Generate a violin plot, used to display the distribution of data, combining features of boxplots and density plots to provide a more detailed view of the data distribution.
25. generate_word_cloud_chart: Generate a word-cloud, used to display the frequency of words in textual data, with font sizes indicating the frequency of each word.

Note

The above geographic visualization chart generation tool uses AMap service and currently only supports map generation within China.

🤖 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

⚙️ Environment Variables

Variable	Description	Default	Example
VIS_REQUEST_SERVER	Custom chart generation service URL for private deployment	https://antv-studio.alipay.com/api/gpt-vis	https://your-server.com/api/chart
SERVICE_ID	Service identifier for chart generation records	-	your-service-id-123
DISABLED_TOOLS	Comma-separated list of tool names to disable	-	generate_fishbone_diagram,generate_mind_map

📠 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.

• Method: POST
• Parameter: Which will be passed to GPT-Vis-SSR for rendering. Such as, { "type": "line", "data": [{ "time": "2025-05", "value": 512 }, { "time": "2025-06", "value": 1024 }] }.
• Return: The return object of HTTP service.
  • success: boolean Whether generate chart image successfully.
  • resultObj: string The chart image url.
  • errorMessage: string When success = false, return the error message.

Note

The private deployment solution currently does not support geographic visualization chart generation include 3 tools: geographic-district-map, geographic-path-map, geographic-pin-map.

🗺️ Generate Records

By default, users are required to save the results themselves, but we also provide a service for viewing the chart generation records, which requires users to generate a service identifier for themselves and configure it.

Use Alipay to scan and open the mini program to generate a personal service identifier (click the "My" menu below, enter the "My Services" page, click the "Generate" button, and click the "Copy" button after success):

Next, you need to add the SERVICE_ID environment variable to the MCP server configuration. For example, the configuration for Mac is as follows (for Windows systems, just add the env variable):

{
  "mcpServers": {
    "AntV Map": {
      "command": "npx",
      "args": [
        "-y",
        "@antv/mcp-server-chart"
      ],
      "env": {
        "SERVICE_ID": "***********************************"
      }
    }
  }
}

After updating the MCP Server configuration, you need to restart your AI client application and check again whether you have started and connected to the MCP Server successfully. Then you can try to generate the map again. After the generation is successful, you can go to the "My Map" page of the mini program to view your map generation records.

🎛️ Tool Filtering

You can disable specific chart generation tools using the DISABLED_TOOLS environment variable. This is useful when certain tools have compatibility issues with your MCP client or when you want to limit the available functionality.

{
  "mcpServers": {
    "mcp-server-chart": {
      "command": "npx",
      "args": [
        "-y",
        "@antv/mcp-server-chart"
      ],
      "env": {
        "DISABLED_TOOLS": "generate_fishbone_diagram,generate_mind_map"
      }
    }
  }
}

Available tool names for filtering See the ✨ Features.

🔨 Development

Install dependencies:

npm install

Build the server:

npm run build

Start the MCP server:

npm run start

📄 License

MIT@AntV.