阿里开源MCP MCP Server Chart：AI时代的智能图表解决方案

zaizaizhao
1,397 阅读5分钟

项目背景

最近公司内部正好在做一个ai工具生成图表， MCP Server Chart 项目正好可以解决该问题（tips:私有化部署方案请移步参考# 数据可视化解决方案：MCP Server Chart 的私有化部署实践。该项目基于 Model Context Protocol (MCP) 协议，为AI应用提供了强大的图表生成能力，让AI能够智能地将数据转换为各种类型的可视化图表。

项目简介

MCP Server Chart 是一个基于TypeScript开发的MCP服务器。该项目的核心价值在于：

  • 🤖 AI友好：通过MCP协议让AI模型能够直接调用图表生成功能
  • 📊 功能丰富：支持20+种图表类型，覆盖了绝大多数数据可视化场景
  • 🚀 开箱即用：提供多种部署方式，支持私有化部署
  • 🌏 地图支持：集成高德地图服务，支持中国地区的地理可视化

核心特性

1. 丰富的图表类型支持

项目目前支持20多种图表类型，基本涵盖了所有常见的数据可视化需求：

基础图表类型：

  • 📈 折线图 (Line Chart)：展示数据随时间或连续变量的变化趋势
  • 📊 柱状图 (Column Chart)：用于不同类别数据的垂直对比
  • 📋 条形图 (Bar Chart)：用于不同类别数据的水平对比
  • 🥧 饼图 (Pie Chart)：展示数据的占比关系

高级图表类型：

  • 📦 箱线图 (Boxplot)：显示数据分布情况，包括中位数、四分位数和异常值
  • 🌊 面积图 (Area Chart)：显示连续数据的整体趋势和累积效果
  • 💧 水滴图 (Liquid Chart)：以水球形式直观展示百分比数据
  • 🕷️ 雷达图 (Radar Chart)：多维数据的综合展示

专业图表类型：

  • 🌊 桑基图 (Sankey Chart)：展示数据流向和流量大小
  • 🗂️ 树状图 (Treemap)：展示层次化数据，矩形大小代表数据值
  • ⚡ 漏斗图 (Funnel Chart)：展示不同阶段的数据流失情况
  • 🎯 散点图 (Scatter Chart)：展示两个变量之间的关系

业务专用图表：

  • 🐟 鱼骨图 (Fishbone Diagram)：问题根因分析工具
  • 🧠 思维导图 (Mind Map)：展示思维过程和层次信息
  • 🏢 组织架构图 (Organization Chart)：展示组织结构和人员关系
  • 🌐 网络图 (Network Graph)：展示节点间的关系和连接

地理可视化：

  • 🗺️ 行政区划图 (District Map)：展示行政区域和数据分布
  • 📍 标记地图 (Pin Map)：展示POI点的分布情况
  • 🛣️ 路径地图 (Path Map)：展示路线规划结果

2. 多种部署模式

项目提供了灵活的部署选择：

标准模式（STDIO）：

# 使用npx直接运行
npx -y @antv/mcp-server-chart

HTTP服务模式：

# SSE传输模式
mcp-server-chart --transport sse --port 1122

# Streamable传输模式  
mcp-server-chart --transport streamable --port 1122

私有化部署：
该mcp的图表生成服务是阿里提供的现成方案，由于是内部系统，无法通过外网访问阿里的服务。这个项目支持通过环境变量 VIS_REQUEST_SERVER 配置自定义的图表生成服务，确保数据安全和服务可控。
源码如下

    import process from "node:process";

    /**
    * Get the VIS_REQUEST_SERVER from environment variables.
    */
    export function getVisRequestServer() {
    return (
        process.env.VIS_REQUEST_SERVER ||
        "https://antv-studio.alipay.com/api/gpt-vis"
    );
    }

    /**
    * Get the `SERVICE_ID` from environment variables.
    */
    export function getServiceIdentifier() {
    return process.env.SERVICE_ID;
    }

由于公司是内网，我也自己写了个服务端去部署该项目。有本地化部署的小伙伴可以参考这篇文章参考文章

3. MCP配置和效果

配置示例（Claude Desktop）：

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

示例1：根据公司已有数据，由AI进行整理绘制条形图

示例2： 得益于AI的数据生成能力，给出宽泛的问题，由AI对生成结果进行可视化展示

这个mcp可以很方便的集成到公司内部开发的mcp client。

实际应用场景

1. AI看板系统

在企业AI看板建设中，该项目可以作为核心的可视化引擎：

  • 智能报表生成：AI根据业务数据自动选择合适的图表类型
  • 多维数据展示：通过雷达图、桑基图等复杂图表展示多维业务指标
  • 实时数据监控：结合流式数据生成动态更新的可视化图表

2. 数据分析助手

在数据分析场景中，可以让AI助手具备强大的数据可视化能力：

  • 探索性数据分析：通过散点图、箱线图等快速发现数据模式
  • 业务洞察展示：使用漏斗图分析转化率，用桑基图展示用户流向
  • 地理数据分析：在中国区域内进行POI分布、区域对比等地理可视化分析

结语

阿里开源的MCP Server Chart项目为AI时代的数据可视化提供了一个优秀的解决方案。它不仅技术先进、功能丰富，更重要的是为企业构建AI看板、智能分析平台等应用提供了强有力的技术支撑。

对于正在考虑AI看板建设的企业来说，这个项目无疑是一个值得关注和尝试的技术选择。它既能够满足当前的可视化需求，也为未来的AI智能化升级留出了充足的扩展空间。

在AI与数据可视化深度融合的大趋势下，像MCP Server Chart这样的项目将会发挥越来越重要的作用，成为推动智能化转型的重要基础设施。

avatar
文章
阅读
粉丝