Quickchart MCP Server

What is Quickchart MCP Server about?

Provides a Model Context Protocol (MCP) server that transforms Chart.js configuration objects into QuickChart.io URLs or downloadable image files, enabling programmatic chart creation within MCP‑enabled applications.

How to use Quickchart MCP Server?

Installation – run npm install @gongrzhe/quickchart-mcp-server or use the Smithery shortcut.
MCP configuration – add the server to Claude Desktop (or any MCP client) with:

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

Invoke tools – call the generate_chart tool with a Chart.js config to receive a chart URL, or download_chart with the same config plus an output path to save the image locally.

Key features of Quickchart MCP Server

Supports 11 chart types (bar, line, pie, doughnut, radar, polarArea, scatter, bubble, radialGauge, speedometer, etc.).
Full Chart.js configuration compatibility (labels, datasets, colors, options).
Two main tools: generate_chart (returns a QuickChart URL) and download_chart (writes PNG/JPEG to a file).
TypeScript codebase, easy to extend or integrate.
Works with Claude Desktop, Smithery, or any MCP‑compatible client.

Use cases of Quickchart MCP Server

Automating report generation with dynamic charts.
Embedding real‑time visualizations in AI assistants.
Creating dashboards where chart images are required as static assets.
Exporting charts for documentation, presentations, or email summaries.
Providing visual feedback in workflow‑automation pipelines.

FAQ from the Quickchart MCP Server

Do I need an API key? No, QuickChart.io offers a free tier that works without authentication for typical chart sizes.
What image formats are supported? PNG and JPEG are returned by the QuickChart service; the download_chart tool saves the format provided by the service.
Can I customize chart size? Yes, include width and height in the Chart.js configuration under options.
Is there a rate limit? The public QuickChart service has generous limits; for heavy usage consider self‑hosting QuickChart.
How do I update the server? Run npm update @gongrzhe/quickchart-mcp-server or reinstall via Smithery.

quickchart-server MCP Server

A Model Context Protocol server for generating charts using QuickChart.io

This is a TypeScript-based MCP server that provides chart generation capabilities. It allows you to create various types of charts through MCP tools.

Overview

This server integrates with QuickChart.io's URL-based chart generation service to create chart images using Chart.js configurations. Users can generate various types of charts by providing data and styling parameters, which the server converts into chart URLs or downloadable images.

Features

Tools

generate_chart - Generate a chart URL using QuickChart.io
- Supports multiple chart types: bar, line, pie, doughnut, radar, polarArea, scatter, bubble, radialGauge, speedometer
- Customizable with labels, datasets, colors, and additional options
- Returns a URL to the generated chart
download_chart - Download a chart image to a local file
- Takes chart configuration and output path as parameters
- Saves the chart image to the specified location

Supported Chart Types

Bar charts: For comparing values across categories
Line charts: For showing trends over time
Pie charts: For displaying proportional data
Doughnut charts: Similar to pie charts with a hollow center
Radar charts: For showing multivariate data
Polar Area charts: For displaying proportional data with fixed-angle segments
Scatter plots: For showing data point distributions
Bubble charts: For three-dimensional data visualization
Radial Gauge: For displaying single values within a range
Speedometer: For speedometer-style value display

Usage

Chart Configuration

The server uses Chart.js configuration format. Here's a basic example:

{
  "type": "bar",
  "data": {
    "labels": ["January", "February", "March"],
    "datasets": [{
      "label": "Sales",
      "data": [65, 59, 80],
      "backgroundColor": "rgb(75, 192, 192)"
    }]
  },
  "options": {
    "title": {
      "display": true,
      "text": "Monthly Sales"
    }
  }
}

URL Generation

The server converts your configuration into a QuickChart URL:

https://quickchart.io/chart?c={...encoded configuration...}

Development

Install dependencies:

npm install

Build the server:

npm run build

Installation

Installing

npm install @gongrzhe/quickchart-mcp-server

Installing via Smithery

To install QuickChart Server for Claude Desktop automatically via Smithery:

npx -y @smithery/cli install @gongrzhe/quickchart-mcp-server --client claude

To use with Claude Desktop, add the server config:

On MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json On Windows: %APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "quickchart-server": {
      "command": "node",
      "args": ["/path/to/quickchart-server/build/index.js"]
    }
  }
}

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

Documentation References

📜 License

This project is licensed under the MIT License.

Quickchart MCP Server