返回 MCP 目录
public公开dns本地运行

Quickchart-MCP-Server

基于QuickChart.io的图表生成MCP服务

article

README

🚀 快速图表 MCP 服务器

这是一个基于 TypeScript 的 MCP 服务器,可通过 QuickChart.io 生成各类图表。借助 MCP 工具,用户能轻松创建不同类型的可视化图表,满足多样化的数据展示需求。

🚀 快速开始

该服务器与 QuickChart.io 的基于 URL 的图表生成服务集成,利用 Chart.js 配置生成图表图像。用户只需提供数据和样式参数,服务器就能将其转换为图表的 URL 或可下载的图像。

图片

✨ 主要特性

工具

  • generate_chart - 使用 QuickChart.io 生成图表 URL

    • 支持多种图表类型:柱状图、折线图、饼图、环形图、雷达图、极坐标面积图、散点图、气泡图、径向仪表盘、速度计
    • 可自定义标签、数据集、颜色和额外选项
    • 返回生成的图表 URL
  • download_chart - 将图表图像下载到本地文件中

    • 接收图表配置和输出路径作为参数
    • 将图表图像保存到指定位置

图片

图片

支持的图表类型

  • 柱状图:用于比较不同类别的值
  • 折线图:用于显示时间趋势
  • 饼图:用于展示比例数据
  • 环形图:类似于饼图,中间为空白
  • 雷达图:用于显示多变量数据
  • 极坐标面积图:用于显示固定角度分段的比例数据
  • 散点图:用于显示数据点分布
  • 气泡图:用于显示数据点的大小和位置
  • 径向仪表盘:用于显示指标值
  • 速度计:用于显示范围值

💻 使用示例

基础用法

const chart = {
  type: 'bar', // 图表类型
  data: {
    labels: ['A', 'B', 'C'], // 数据标签
    datasets: [{
      label: '数据集1',
      data: [65, 59, 80], // 数据值
      backgroundColor: '#FF6B6B' // 数据背景颜色
    }]
  },
  options: {
    responsive: true, // 是否响应式
    scales: {
      y: {
        beginAtZero: true // Y轴从零开始
      }
    }
  }
};

生成图表

# 使用 generate_chart 工具
npx quickchart-server generate-chart --config=config.json --output=output.png

# 或直接运行脚本
node index.js --generate --config=config.json --output=output.png

📦 安装指南

安装依赖

npm install

启动开发服务器

npm run dev

测试工具

npm test

📚 详细文档

📄 许可证

此项目使用 MIT 许可证。

help

运行方式说明

cloud

托管运行

托管运行通常表示这个 MCP Server 由服务方环境承载,用户一般按页面提供的连接方式或授权流程接入,不需要在本地长期启动一个 MCP 进程

  1. 打开服务方连接页
  2. 完成授权或复制端点
  3. 在 MCP 客户端中连接
terminal

本地运行 / 其它方式

本地运行通常需要用户在自己的电脑或服务器上安装依赖,把 server_config 复制到 MCP 客户端,并按 env_schema 补齐环境变量、密钥或其它配置

  1. 复制 server_config
  2. 安装所需依赖
  3. 补齐环境变量后重启客户端