首页/Mcp Server Chart

Data Visualization

Mcp Server Chart

Name: Mcp Server Chart
Rating: 4000 (370 reviews)
Author: antvis

基于AntV的MCP图表生成服务器，可在支持MCP的AI客户端中生成26+种图表与表格。

查看 GitHub 查看同类项目

仓库antvis/mcp-server-chart

来源github

创建时间2026/4/19

最近同步2026/4/20

一句话总结

基于AntV的MCP图表生成服务器，可在支持MCP的AI客户端中生成26+种图表与表格。

项目描述

MCPServerChart是一个基于TypeScript的MCPServer，提供面积图、柱状图、桑基图、词云、流程图、思维导图、地图和数据透视表等26+可视化生成工具。适合在Claude、Cursor、VSCode、Dify等支持MCP或Skill的环境中，让AI根据数据或描述快速产出图表的开发者、分析人员和AIIDE用户。

MCP 服务器图表

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

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

✨ 特点

现在支持 26+ 图表。

mcp-server-chart preview 1. generate_area_chart：生成area图表，用于展示连续自变量下数据的趋势，可以观察整体数据趋势。

generate_bar_chart：生成bar图表，用于比较不同类别的值，适合水平比较。
generate_boxplot_chart：生成一个boxplot，用于展示数据的分布情况，包括中位数、四分位数和异常值。
generate_column_chart：生成column图表，用于比较不同类别的值，适合垂直比较。
generate_district_map - 生成一个district-map，用于展示行政区划和数据分布。
generate_dual_axes_chart：生成dual-axes图表，用于显示不同单位或范围的两个变量之间的关系。
generate_fishbone_diagram：生成fishbone图，也称为石川图，用于识别和显示问题的根本原因。
generate_flow_diagram：生成一个flowchart，用于显示一个流程的步骤和顺序。
generate_funnel_chart：生成funnel图表，用于展示不同阶段的数据丢失情况。 1、generate_histogram_chart：生成一个histogram，用于通过划分区间并统计每个区间内数据点的数量来显示数据的分布情况。
generate_line_chart：生成line图表，用于显示数据随时间或其他连续变量变化的趋势。
generate_liquid_chart：生成liquid图表，用于展示数据的比例，以充满水的球体的形式直观地表示百分比。
generate_mind_map：生成一个mind-map，用于展示思维过程和层次信息。
generate_network_graph：生成network图，用于显示节点之间的关系和连接。
generate_organization_chart：生成organizational图表，用于展示组织结构和人员关系。
generate_path_map - 生成path-map，用于显示POI的路线规划结果。
generate_pie_chart：生成一个pie图表，用于显示数据的比例，将其划分为多个部分，用扇区表示，显示每个部分的百分比。
generate_pin_map - 生成一个pin-map，用于展示POI的分布。
generate_radar_chart：生成radar图表，用于全面展示多维度数据，以类似雷达的格式展示多个维度。
generate_sankey_chart：生成sankey图表，用于展示数据流向和数量，以Sankey风格的格式表示数据在不同节点之间的移动。
generate_scatter_chart：生成scatter图，用于显示两个变量之间的关系，将数据点显示为坐标系上的散点。
generate_treemap_chart：生成一个treemap，用于展示分层数据，以矩形的形式展示数据，矩形的大小代表数据的值。
generate_venn_chart：生成venn图，用于显示集合之间的关系，包括交集、并集和差集。
generate_violin_chart：生成violin图，用于展示数据的分布情况，结合箱线图和密度图的特点，提供更详细的数据分布视图。
generate_word_cloud_chart：生成一个word-cloud，用于显示文本数据中单词的频率，字体大小表示每个单词的频率。
generate_spreadsheet：生成spreadsheet或数据透视表以显示表格数据。当提供“行”或“值”字段时，它会呈现为数据透视表（交叉表）；否则，它呈现为常规表格。> [!注意]

上述地理可视化图表生成工具使用AMap service，目前仅支持中国境内的地图生成。

🤖 用法

要与 Desktop APP 一起使用，例如 Claude、VSCode、Cline、Cherry Studio、Cursor 等，请添加下面的 MCP 服务器配置。在Mac系统上：

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

在Windows系统上：

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

此外，您还可以在 aliyun、modelscope、glama.ai、smithery.ai 或其他具有 HTTP、SSE 协议的协议上使用它。

🎨 技能使用

如果您使用具有技能支持的 AI IDE（例如 Claude Code），您可以使用 chart-visualization 技能自动选择最佳图表类型并生成可视化效果。

您可以使用以下方法添加 https://github.com/antvis/chart-visualization-skills 中的技能：

npx skills add antvis/chart-visualization-skills

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

🚰 使用 SSE 或 Streamable 传输运行

直接运行

全局安装该包。

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

然后您可以访问服务器：

上交所传输：http://localhost:1122/sse
可流式传输：http://localhost:1122/mcp

Docker 部署

进入docker目录。

cd docker

使用 docker-compose 进行部署。

docker compose up -d

然后您可以访问服务器：

上交所传输：http://localhost:1123/sse
可流式传输：http://localhost:1122/mcp

🎮 CLI 选项

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

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

⚙️ 环境变量

变量	描述	默认	示例
`VIS_REQUEST_SERVER`	用于私有部署的自定义图表生成服务 URL	`https://antv-studio.alipay.com/api/gpt-vis`	`https://your-server.com/api/chart`
`SERVICE_ID`	图表生成记录的服务标识符	-	`your-service-id-123`
`DISABLED_TOOLS`	要禁用的以逗号分隔的工具名称列表	-	`generate_fishbone_diagram,generate_mind_map`

📠 私有部署

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

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

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

方法：POST
参数：将传递给 GPT-Vis-SSR 进行渲染。例如，{ "type": "line", "data": [{ "time": "2025-05", "value": 512 }, { "time": "2025-06", "value": 1024 }] }。
Return：HTTP服务的返回对象。
成功：boolean 是否成功生成图表图像。
resultObj：string 图表图像 URL。
errorMessage: 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 Server 配置后，您需要重新启动 AI 客户端应用程序并再次检查是否已成功启动并连接到 MCP Server。然后您可以尝试再次生成地图。生成成功后，您可以前往小程序“我的地图”页面查看您的地图生成记录。

🎛️ 工具过滤

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

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

可用于过滤的工具名称 请参阅✨ Features。

🔨 发展

安装依赖项：

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。