MCP Server Chart

MCP服务器图表

用于生成图表的模型上下文协议服务器 AntV。我们可以使用此mcp服务器 _图表生成_ 和 _数据分析_.

这是一个基于TypeScript的MCP服务器，提供图表生成功能。它允许您通过MCP工具创建各种类型的图表。您还可以在 迪菲.

📋 目录

• ✨ 特性
• 🤖 用法
• 🎨 技能使用
• 🚰 使用SSE或流媒体传输运行
• 🎮 CLI选项
• ⚙️ 环境变量

- VIS_REQUEST_SERVER - SERVICE_ID - 禁用工具

• 📠 私有部署
• 🗺️ 生成记录
• 🎛️ 工具筛选
• 🔨 发展
• 📄 许可证

✨ 特性

现在支持26+个图表。

1. generate_area_chart：生成 area 图表，用于显示连续自变量下的数据趋势，允许观察整体数据趋势。
2. generate_bar_chart：生成 bar 图表，用于比较不同类别的值，适用于横向比较。
3. generate_boxplot_chart：生成 boxplot，用于显示数据的分布，包括中位数、四分位数和异常值。
4. generate_column_chart：生成 column 图表，用于比较不同类别的值，适用于垂直比较。
5. generate_district_map -生成一个 district-map，用于显示行政区划和数据分布。
6. generate_dual_axes_chart：生成 dual-axes 图表，用于显示具有不同单位或范围的两个变量之间的关系。
7. generate_fishbone_diagram：生成 fishbone 该图也称为石川图，用于识别和显示问题的根本原因。
8. generate_flow_diagram：生成 flowchart，用于显示流程的步骤和顺序。
9. generate_funnel_chart：生成 funnel 图表，用于显示不同阶段的数据丢失。
10. generate_histogram_chart：生成 histogram，用于通过将数据划分为区间并计算每个区间中的数据点数量来显示数据的分布。
11. generate_line_chart：生成 line 图表，用于显示数据随时间或其他连续变量的趋势。
12. generate_liquid_chart：生成 liquid 图表，用于显示数据的比例，以充水球体的形式直观地表示百分比。
13. generate_mind_map：生成 mind-map，用于显示思维过程和层次信息。
14. generate_network_graph：生成 network 图，用于显示节点之间的关系和连接。
15. generate_organization_chart：生成 organizational 图表，用于显示组织结构和人员关系。
16. generate_path_map -生成一个 path-map，用于显示POI的路线规划结果。
17. generate_pie_chart：生成 pie 图表，用于显示数据的比例，将其划分为由扇区表示的部分，显示每个部分的百分比。
18. generate_pin_map -生成一个 pin-map，用于显示POI的分布。
19. generate_radar_chart：生成 radar 图表，用于全面显示多维数据，以类似雷达的格式显示多个维度。
20. generate_sankey_chart：生成 sankey 图表，用于显示数据流和数据量，以Sankey风格的格式表示不同节点之间的数据移动。
21. generate_scatter_chart：生成 scatter 绘图，用于显示两个变量之间的关系，将数据点显示为坐标系上的散点。
22. generate_treemap_chart：生成 treemap，用于显示分层数据，以矩形形式显示数据，其中矩形的大小表示数据的值。
23. generate_venn_chart：生成 venn 图表，用于显示集合之间的关系，包括交集、并集和差异。
24. generate_violin_chart：生成 violin 绘图，用于显示数据分布，结合箱线图和密度图的特征，提供更详细的数据分布视图。
25. generate_word_cloud_chart：生成 word-cloud，用于显示文本数据中单词的频率，字体大小表示每个单词的频率。
26. generate_spreadsheet：生成 spreadsheet 或用于显示表格数据的透视表。当提供“行”或“值”字段时，它呈现为数据透视表（交叉制表）；否则，它将呈现为常规表。

\[！注意\] 上述地理可视化图表生成工具使用 AMap服务 目前仅支持在中国境内生成地图。

🤖 用法

与一起使用 Desktop APP例如克劳德、VSCode、， 克莱恩Cherry Studio、Cursor等，在下面添加MCP服务器配置。在Mac系统上：

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

On Window系统：

{
  "mcpServers": {
    "mcp-server-chart": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "@antv/mcp-server-chart"]
    }
  }
}

此外，您还可以在 阿里云, 魔搭, glama.ai, 史密斯艾 或使用HTTP、SSE协议的其他协议。

🎨 技能使用

如果你正在使用具有技能支持的AI IDE（如 克劳德代码)，您可以使用 chart-visualization 自动选择最佳图表类型并生成可视化的技能。

您可以从以下位置添加技能 使用：

npx skills add antvis/chart-visualization-skills

然后提供您的数据或描述您想要的可视化。该技能将智能地从25种以上的图表类型中进行选择，并为您生成图表。

🚰 使用SSE或流媒体传输运行

直接运行

全局安装该软件包。

npm install -g @antv/mcp-server-chart

使用首选传输选项运行服务器：

# For SSE transport (default endpoint: /sse)
mcp-server-chart --transport sse

# For Streamable transport with custom endpoint
mcp-server-chart --transport streamable

然后，您可以访问服务器：

• SSE运输： http://localhost:1122/sse
• 可流动运输： http://localhost:1122/mcp

Docker部署

进入docker目录。

cd docker

使用docker compose进行部署。

docker compose up -d

然后，您可以访问服务器：

• SSE运输： http://localhost:1123/sse
• 可流动运输： http://localhost:1122/mcp

🎮 CLI选项

运行MCP服务器时，您还可以使用以下CLI选项。使用run-cli命令选项 -H.

MCP Server Chart CLI

Options:
  --transport, -t  Specify the transport protocol: "stdio", "sse", or "streamable" (default: "stdio")
  --host, -h       Specify the host for SSE or streamable transport (default: localhost)
  --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

⚙️ 环境变量

📠 私有部署

MCP Server Chart 默认情况下，提供免费的图表生成服务。对于需要私有部署的用户，他们可以尝试使用 VIS_REQUEST_SERVER 自定义自己的图表生成服务。

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

您可以使用AntV的项目 GPT Vis SSR 在私有环境中部署HTTP服务，然后通过env传递URL地址 VIS_REQUEST_SERVER.

• 方法: POST
• 参数：将传递给 GPT-Vis-SSR 用于渲染。例如， { "type": "line", "data": [{ "time": "2025-05", "value": 512 }, { "time": "2025-06", "value": 1024 }] }.
• 返回：HTTP服务的返回对象。

- 成功: boolean 是否成功生成图表图像。 - 结果: string 图表图像url。 - 错误消息: string 当 success = false，返回错误消息。

\[！注意\] 私有部署解决方案目前不支持地理可视化。图表生成包括3个工具： geographic-district-map, geographic-path-map, geographic-pin-map.

🗺️ 生成记录

默认情况下，用户需要自己保存结果，但我们也提供了一种查看图表生成记录的服务，这要求用户为自己生成一个服务标识符并对其进行配置。

使用支付宝扫描并打开小程序生成个人服务标识符（点击下面的“我的”菜单，进入“我的服务”页面，点击“生成”按钮，成功后点击“复制”按钮）：

接下来，您需要添加 SERVICE_ID MCP服务器配置的环境变量。例如，Mac的配置如下（对于Windows系统，只需添加 env 变量）：

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

更新MCP服务器配置后，您需要重新启动AI客户端应用程序，并再次检查是否已成功启动并连接到MCP服务器。然后，您可以尝试再次生成地图。生成成功后，您可以转到小程序的“我的地图”页面查看您的地图生成记录。

🎛️ 工具筛选

您可以使用禁用特定的图表生成工具 DISABLED_TOOLS 环境变量。当某些工具与MCP客户端存在兼容性问题，或者您想限制可用功能时，这很有用。

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

用于筛选的可用工具名称 请参阅 ✨ 特性.

🔨 发展

安装依赖项：

npm install

构建服务器：

npm run build

启动MCP服务器：

npm run start

使用SSE传输启动MCP服务器：

node build/index.js -t sse

使用Streamable传输启动MCP服务器：

node build/index.js -t streamable

📄 许可证

麻省理工学院@AntV.