Echarts MCP

🚀 ECharts MCP 服务器

这是一个模型上下文协议（MCP）服务器，可根据 ECharts 配置生成美观的图表图像。

🚀 快速开始

本服务器可根据 ECharts 配置生成高质量的图表图像，支持多种图表类型，可轻松与 AI 助手集成。

✨ 主要特性

• 🎨 根据 ECharts 配置生成高质量的图表图像
• 🖼️ 支持多种图表类型（柱状图、折线图、饼图、散点图等）
• 📐 可自定义尺寸（宽度/高度）
• 🎯 通过 MCP 轻松与 AI 助手集成

📦 安装指南

配置文件

在 .cursor/mcp.json 中进行如下配置：

{
  "mcpServers": {
    "echarts-mcp": {
      "command": "npx",
      "args": ["echarts-mcp"],
    }
  }
}

本地开发

如果你想从源代码运行：

# 克隆仓库
git clone https://github.com/w2xi/echarts-mcp.git
cd echarts-mcp

# 安装依赖
npm install

# 启动服务器
npm start

然后配置你的 MCP 客户端：

{
  "mcpServers": {
    "echarts-mcp": {
      "command": "node",
      "args": ["/path/to/echarts-mcp/cli.js"],
      "env": {}
    }
  }
}

💻 使用示例

基本用法

配置完成后，你可以在 AI 助手中通过请求生成图表来使用 MCP 服务器。

示例提示

• "生成一个显示过去 6 个月销售数据的柱状图"
• "创建一个展示市场份额分布的饼图"
• "制作一个随时间变化的温度数据折线图"

工具参数

• width：图表宽度（像素），例如 1000
• height：图表高度（像素），例如 500
• echarts：ECharts 配置对象的字符串形式

示例 ECharts 配置

{
  backgroundColor: '#fff',
  title: {
    text: 'Monthly Sales Data'
  },
  tooltip: {},
  legend: {
    data: ['Sales']
  },
  xAxis: {
    data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']
  },
  yAxis: {},
  series: [{
    name: 'Sales',
    type: 'bar',
    data: [120, 200, 150, 80, 70, 110]
  }]
}

📚 详细文档

开发脚本

• npm start - 启动 MCP 服务器
• npm test - 运行测试图表
• npm run inspect - 使用调试工具检查 MCP 服务器

依赖项

• ECharts：图表生成库
• Canvas：服务器端画布渲染
• MCP SDK：模型上下文协议实现
• Zod：模式验证

🤝 贡献

欢迎贡献代码！请随时提交拉取请求。

📄 许可证

本项目采用 MIT 许可证。

🔗 链接

• ECharts 文档
• 模型上下文协议

由 w2xi 用心打造 ❤️