mcp-echarts
๐งฌ Generate visual charts using ECharts with AI MCP dynamically, used for chart generation and data analysis. TypeScript-based implementation.
Documentation
MCP ECharts !     
Generate Apache ECharts with AI MCP dynamically for chart generation and data analysis. _Also you can use mcp-server-chart to generate chart, graph, map._
โจ Features
- Fully support all features and syntax of `ECharts`, include data, style, theme and so on.
- Support exporting to `png`, `svg`, and `option` formats, with validation for `ECharts` to facilitate the model's multi-round output of correct syntax and graphics.
- MinIO Integration, store charts in `MinIO` object storage and return URLs instead of Base64 data for better performance and sharing capabilities.
- Lightweight, we can install it easily with `zero dependence`.
- Extremely `secure`, fully generated locally, without relying on any remote services.
๐ค Usage
Prerequisites
- Node.js 18 or higher is required.
Desktop Applications (stdio transport)
To use with `Desktop APP`, such as Claude, VSCode, Cline, Cherry Studio, and so on, add the MCP server config below. On Mac system:
{
"mcpServers": {
"mcp-echarts": {
"command": "npx",
"args": [
"-y",
"mcp-echarts"
]
}
}
}On Window system:
{
"mcpServers": {
"mcp-echarts": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"mcp-echarts"
]
}
}
}Also, you can use it on modelscope, glama.ai, skillselion.com or others with HTTP, SSE Protocol.
๐ฐ Run with SSE or Streamable transport
Install the package globally.
npm install -g mcp-echartsRun the server with your preferred transport option:
# For SSE transport (default endpoint: /sse)
mcp-echarts -t sse
# For Streamable transport with custom endpoint
mcp-echarts -t streamableThen you can access the server at:
- SSE transport: `http://localhost:3033/sse`
- Streamable transport: `http://localhost:3033/mcp`
๐ฎ CLI Options
You can also use the following CLI options when running the MCP server. Command options by run cli with `-h`.
MCP ECharts CLI
Options:
--transport, -t Specify the transport protocol: "stdio", "sse", or "streamable" (default: "stdio")
--port, -p Specify the port for SSE or streamable transport (default: 3033)
--endpoint, -e Specify the endpoint for the transport:
- For SSE: default is "/sse"
- For streamable: default is "/mcp"
--help, -h Show this help message๐๏ธ MinIO Configuration (Optional)
For better performance and sharing capabilities, you can configure MinIO object storage to store chart images as URLs instead of Base64 data.
> [!NOTE]
> If MinIO is not configured or unavailable, the system automatically falls back to `Base64` data output, ensuring compatibility.
We can Integrate with `MinIO` object storage providers below.
Also, we can setup MinIO locally for free.
1. Install and start MinIO locally:
# Download MinIO (macOS example)
brew install minio/stable/minio
# Start MinIO server
minio server ~/minio-data --console-address :90013. Configure environment variables:
# Copy the example environment file
cp .env.example .env
# Edit .env with your MinIO settings
MINIO_ENDPOINT=localhost
MINIO_PORT=9000
MINIO_USE_SSL=false
MINIO_ACCESS_KEY=minioadmin
MINIO_SECRET_KEY=minioadmin
MINIO_BUCKET_NAME=mcp-echarts๐จ Development
Install dependencies:
npm installBuild the server:
npm run buildStart the MCP server:
npm run start๐ง๐ปโ๐ป Contributors
- lyw405: Supports `15+` charting MCP tool. #2
- 2niuhe: Support MCP with SSE and Streaming HTTP. #17
- susuperli: Use `MinIO` to save the chart image base64 and return the url. #10
- BQXBQX: Use `@napi-rs/canvas` instead node-canvas. #3
- Meet-student: Add `outputType` schema for all chart tools. #24
- hustcc: Initial the repo.
๐ License
MIT@hustcc.
Frequently asked questions
What is mcp-echarts?
mcp-echarts is ๐งฌ Generate visual charts using ECharts with AI MCP dynamically, used for chart generation and data analysis. TypeScript-based implementation.
How do I install mcp-echarts?
Open the GitHub repository and follow its README. Most MCP servers are added to your client's MCP config, then called by your agent.
Is mcp-echarts open source?
Yes โ it is hosted on GitHub at https://github.com/hustcc/mcp-echarts and has 129 stars.
Related MCP tools
๐ค A visualization mcp contains 25+ visual charts using @antvis. Using for chart generation and data analysis. TypeScript-based implementation.
A Unified MCP Server Management App TypeScript-based implementation. Trusted by 800+ developers. Trusted by 800+ developers.
FastGPT is a knowledge-based platform built on the LLMs, offers a comprehensive suite of out-of-the-box capabilities such as data processing, RAG retrieval, ...
Composio equips your AI agents & LLMs with 100+ high-quality integrations via function calling for the Model Context Protocol. Enhance AI assistants with powerf
๐ฆ Repomix is a powerful tool that packs your entire repository into a single, AI-friendly file. Perfect for when you need to feed your codebase to Large Lan...
AI Agents & MCPs & AI Workflow Automation โข (~400 MCP servers for AI agents) โข AI Automation / AI Agent with MCPs โข AI Workflows & AI Agents โข MCPs for AI Ag...
Run your own MCP server? See who uses it and what to fix.
Measure it with TrackMCP