推荐语

轻松将数据转化为直观图表，mcp-server-chart让数据展示变得简单直观。

核心内容：
1. mcp-server-chart支持15种常用图表类型
2. AI助手通过简单配置即可生成图表
3. Dify结合MCP的玩法，简化数据可视化流程

杨芳贤

53A创始人/腾讯云(TVP)最具价值专家

在日常工作和学习中，我们经常需要和数据打交道。无论是分析报告、项目展示，还是简单的数据洞察，一个清晰直观的图表，往往能胜过千言万语。

但很多时候，制作图表，尤其是想让 AI 动态生成图表，却不是一件轻松的事。

今天的主角，就是一款能让数据可视化变得超级简单的 MCP Server，由蚂蚁集团 AntV 团队开源的 mcp-server-chart。

github地址：https://github.com/antvis/mcp-server-chart

这个神器目前已经支持超过 15 种我们常用的可视化图表类型，比如：

• 折线图、柱状图、饼图、面积图、条形图
• 直方图、散点图、矩阵树图、词云图、双轴图
• 雷达图、思维导图、网络图、流程图、鱼骨图

可以说，它几乎能满足我们日常工作中绝大多数场景的可视化需求。 最棒的是，它会以图片链接的形式返回生成结果，方便你嵌入到任何需要的地方。

1 MCP 工具初体验：让 AI 秒变图表大师

在支持mcp客户端中（如claude、cursor、cline、Cherry Studio）等中，加上一段简单的配置，就能让你的 AI 助手瞬间get到制作图表的超能力。

配置代码长这样：

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

以cherry studio为例，增加mcp-server-chart配置后就可以直接使用了。

比如我想让AI生成一个中国古代诗人名称的词云图，直接给出需求就行了。

调用了mcp中generate_word_cloud_chart工具，一张精美的词云图就出炉了：

整个过程，大模型就像一位经验丰富的设计师，不仅理解了你的需求，还自动帮你准备好了绘制图表所需的各种参数（比如图片的宽度、高度、标题等），最后给出了图片链接。

支持本地部署，可以用SSE方式运行：

如果不想在本地部署sse，可以在阿里魔搭社区中搜索mcp-server-chart，拿到url地址。

在这里可以获取这个mcp工具的sse地址，测试下来还是比较稳定的。

这样我们就可以方便的使用SSE方式连接MCP服务了。

2 dify+可视化图表MCP的玩法

Dify目前只支持SSE方式使用MCP服务，我要在Agent中调用，首先需要安装支持mcp策略的插件。

在插件市场搜索mcp_sse_agent并安装。

之前我写过不少关于 Dify 结合数据库和 ECharts 实现数据可视化的文章。

坦白说，其中最让人头疼的环节，莫过于如何把数据库查询出来的原始数据，转换成 ECharts能够理解的图表格式。

这个过程，无论是手写代码转换，还是让大模型来构造，都需要不少经验和技巧，一不小心就容易出错。

但是！有了 mcp-server-chart 这个 MCP 工具，事情就变得简单多了。

我们还是用之前的应用场景来演示：用户用自然语言提问，我们通过 Dify 工作流从数据库里查询数据，并生成图表。

整个流程中，前面的需求提炼、自然语言转 SQL 等步骤保持不变，但最关键的图表生成环节，就交给 MCP 工具来大显身手了！

如果你对我之前的文章比较熟悉，并且只想看重点，可以直接跳到 2.7 图文总结 部分。

为了方便演示，我用 MySQL 数据库搭建了一些示例数据，大概是这个样子：

2.1 开始节点

默认配置，接收用户问题。

2.2 需求提炼

分析用户问题，判断用户是否需要生成图表，提取出SQL查询的需求。

输出如下：

sql_requirement: [精炼后的数据查询需求]
need_chart: [是/否]
chart_type: [推荐的Echarts图表类型或“无”]

大模型选择了DeepSeek V3。

提示词如下：

你是一名专业的数据需求提炼师。

请仔细阅读用户的自然语言问题{{#context#}}，只保留与数据查询直接相关的核心需求。自动忽略与数据查询无关的内容（如生成图表、导出Excel、制作报表等）。

请判断用户是否需要用图表展示结果。如果需要，请根据问题内容推荐最合适的Echarts图表类型（如area、bar、column、dual-axes、fishbone-diagram、flow-diagram、histogram、line、mind-map、network-graph、pie、radar、scatter、treemap、word-cloud等）；如果不需要图表，请填写“无”。

请严格按照如下格式输出，不要有任何解释或多余内容：
sql_requirement: [精炼后的数据查询需求]
need_chart: [是/否]
chart_type: [推荐的Echarts图表类型或“无”]

2.3 参数提取器

把上一个节点的三个输出参数提取出来。

2.4 自然语言转SQL（ROOKIE_TEXT2DATA）

这个节点的核心功能就是把用户的自然语言转成SQL语句了。

输入为提取后的SQL语句需求，关联参数提取节点的sql_requirement。

数据库配置: 正确填写数据库类型、IP、端口、库名、用户名、密码。

大模型：我这里就用DeepSeek V3了。

提示词如下：

表名：boxoffice
字段说明：
- years：年份，int
- movie_name：电影名，string
- score：评分，float
- director：导演，string
- box_office：票房，int

注意事项：
- 如有分组统计，请使用SUM、AVG等聚合函数，不要直接用原始字段。
- 所有非聚合字段必须出现在GROUPBY中。
- 只输出SQL语句，不要解释。

示例查询：
1. 查询每个导演的总票房：SELECT director, SUM(box_office) FROM boxoffice GROUPBY director;
2. 查询每年票房最高的电影：SELECT years, movie_name, MAX(box_office) FROM boxoffice GROUPBY years;

2.5 执行SQL（ROOKIE_EXCUTE_SQL）

此节点负责连接数据库，并执行上一步生成的SQL语句。

输入变量：上一节点返回的SQL语句。

数据库配置: 正确填写数据库类型、IP、端口、库名、用户名、密码。

输出变量：返回数据格式为文本。

2.6 条件分支

判断是否需要图表，给到不同的分支。

2.7 图文总结

如果需要生成图表，走这个节点。

Agent策略选择我们之前安装的插件【支持MCP工具的Agent】->ReAct（Support MCP Tools）。

MCP服务器配置如下，url换成你自己的。

可以用阿里魔搭社区的，也可以本地部署生成SSE的URL地址。

{  
    "mcp-server-chart": {
        "url": "https://mcp.api-inference.modelscope.cn/f2fc4749880946/sse",    
        "headers": {}, 
        "timeout": 60,    
        "sse_read_timeout": 300  
    }
}

2.8 文字总结

如果用户只是想查询数据，不需要图表，那么工作流就会走到这个相对简单的节点。它会根据数据库查询结果，用简洁的自然语言给出分析和意见。

2.9 回复节点

直接引用图文总结或文字总结的输出就好了。

2.10 测试

比如问一下各导演的票房占比，可以看到给出了分析结果和图片链接地址。

在测试一下折线图。

3 AntV插件的使用

除了MCP工具，在插件市场搜索antv可以看到蚂蚁集团提供的这个可视化工具插件。

和mcp server一样，也是支持了15种工具。

可以直接创建一个Agent，添加这些工具。

添加工具：

我们就可以随便用自然语言让大模型给出相应的图表了。

我让它生成了一个《三体》小说的人物词云图。

当然了，你也可以在工作流中调用这些工具。

和其他的生成图表的插件类似，给出对应的数据。

不过，这个插件可以更方便的调整图表的大小。自定义图表的宽和高。

我在之前文章里写过，技术的迭代日新月异，或许今天我们讨论的方法，明天就会有更优的实现。

没想到这么快就有了mcp-server-chart 这样的 MCP 工具，在可视化方面又给开发者打开了新的思路。

这些“底层轮子”的不断涌现，无疑是一件大好事。

它们让我们能够从繁琐的、重复性的底层技术实现中解放出来，更专注于业务逻辑本身，更聚焦于如何创造真正的价值。

而且开源项目的魅力在于，如果现有的图表类型不满足你的特殊需求，完全可以在其基础上进行二次开发，增加自定义图表，满足更多元、更个性化的场景。

让我们一起期待，并积极拥抱这个充满无限可能的未来吧！