Amcharts 5 Mcp Server

amCharts 5 MCP 服务

一个 MCP（Model Context Protocol） 服务，可让 AI 助手按需访问完整的 amCharts 5 知识库：160 多个文档页面、290 多个代码示例以及 1,300 多个 API 参考页面。

适用于 Claude Code、Claude Desktop、Cursor、Windsurf、VS Code + GitHub Copilot，以及任何其他兼容 MCP 的 AI 工具。

为什么？

无需将整个 amCharts 参考资料加载到 AI 的上下文窗口中，MCP 服务可以让 AI 精准查询所需内容——特定图表类型的参考资料、代码示例或 API 查询。这意味着上下文浪费更少，回答质量更高。

快速开始

最简单的方法是使用托管服务——无需安装，只需添加一个 URL。想自行运行？ 请参阅下方的本地安装。

托管服务（无需安装）——推荐

将 AI 客户端指向：

https://mcp.amcharts.com/mcp

Claude Code

claude mcp add --transport http amcharts5 https://mcp.amcharts.com/mcp

Claude Desktop / claude.ai — 进入 Settings → Connectors → Add custom connector，然后粘贴 https://mcp.amcharts.com/mcp。

Cursor — .cursor/mcp.json：

{
  "mcpServers": {
    "amcharts5": {
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

VS Code + GitHub Copilot — .vscode/mcp.json：

{
  "servers": {
    "amcharts5": {
      "type": "http",
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

Windsurf — ~/.codeium/windsurf/mcp_config.json：

{
  "mcpServers": {
    "amcharts5": {
      "serverUrl": "https://mcp.amcharts.com/mcp"
    }
  }
}

ChatGPT（启用了 connectors/developer mode 的 Plus/Pro/Enterprise）— 进入 Settings → Connectors → Add custom connector，然后粘贴 https://mcp.amcharts.com/mcp。

Cline（VS Code 扩展）— 打开 MCP Servers 面板 → Remote Servers，粘贴 https://mcp.amcharts.com/mcp，或将其添加到 MCP 设置 JSON 中：

{
  "mcpServers": {
    "amcharts5": {
      "type": "streamableHttp",
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

仅支持本地（stdio）服务的客户端（例如 Zed、Continue、Amazon Q Developer）— 使用 mcp-remote桥接到托管 URL。在客户端配置中将其用作服务的运行命令：

npx mcp-remote https://mcp.amcharts.com/mcp

例如，在采用 command/args 格式的配置中：

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "https://mcp.amcharts.com/mcp"]
    }
  }
}

任何其他接受远程服务 URL 的 MCP 客户端也都可以使用——请使用 /mcp 端点（Streamable HTTP）或 /sse（旧版 SSE）。对于仍要求提供命令的纯 URL 客户端， 请使用上面所示的 mcp-remote 桥接方式。

本地安装（npx）

想自行运行？该服务也已发布到 npm，并通过 stdio 运行。

Claude Code

适用于所有项目（全局，推荐）：

claude mcp add -s user amcharts5 -- npx -y @amcharts/amcharts5-mcp

仅适用于当前项目：

claude mcp add amcharts5 -- npx -y @amcharts/amcharts5-mcp

Claude Desktop

添加到 claude_desktop_config.json：

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

Cursor

在项目根目录中创建或编辑 .cursor/mcp.json（全局配置则使用 ~/.cursor/mcp.json）：

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

Windsurf

编辑 ~/.codeium/windsurf/mcp_config.json：

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

VS Code + GitHub Copilot

在工作区中创建或编辑 .vscode/mcp.json：

{
  "servers": {
    "amcharts5": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

其他兼容 MCP 的工具

对于其他支持 MCP 的工具（Cline、Continue、Amazon Q、Zed 等），请将其配置为运行：

npx -y @amcharts/amcharts5-mcp

本地运行（用于开发）

git clone https://github.com/amcharts/amcharts5-mcp.git
cd amcharts5-mcp
npm install
npm start

可用工具

工具	描述
get_core_reference	获取 amCharts 5 核心文档——设置、主题、颜色、事件和常见问题
get_chart_reference	获取某种图表类型的完整参考（例如「饼图」「桑基图」「xy」）
list_chart_types	列出所有可用的图表类型及其关键词
search_docs	按关键词搜索技能参考文档（scope: "all" 会添加完整文档、API 参考和示例）
search_all	搜索所有内容——技能文档、完整文档和代码示例
get_doc	获取完整的文档页面（例如「charts/xy-chart/axes」「concepts/events」）
get_section	按标题获取参考文件中的特定章节
get_quick_start	获取任意图表类型的最简可运行模板
list_examples	浏览全部 290 多个示例，可按类别筛选
get_example	获取特定示例的完整代码
get_api_reference	获取类、接口或函数的 API 参考——包含默认值、事件、继承关系和导入语句的设置
list_geodata	查找地图（地理数据）文件——世界、大洲、国家、区域包，以及按届划分的美国国会选区包；每个文件均附 CDN 路径、脚本全局变量和 ES 导入语句

使用示例

连接后，你的 AI 助手可以：

• 「帮我制作一个饼图」 → AI 调用 get_quick_start("pie") 并调整模板
• 「如何设置日期轴标签的格式？」 → AI 调用 search_all("date axis label format")
• 「给我看看桑基图示例」 → AI 调用 get_example("examples/flow/sankey-diagram")
• 「XYChart 支持哪些设置？」 → AI 调用 get_doc("reference/xychart")
• 「如何与 React 集成？」 → AI 调用 get_doc("getting-started/integrations/react")，其中介绍了 @amcharts/amcharts5-react 软件包
• 「有哪些可用的图表类型？」 → AI 调用 list_chart_types()
• 「绘制当前的美国国会选区地图」 → AI 调用 list_geodata("congressional whole country")

内容

该服务包含 1,800 多份文档：

• 160 多个文档页面——入门指南、图表指南、概念（主题、事件、适配器、数据绑定、动画、无障碍访问等），以及 amCharts 的 React、Vue、Angular、Svelte 和 React Native 软件包的框架集成指南（涵盖 Next.js、Nuxt、SvelteKit、React Router 和 Remix 3）
• 290 多个代码示例——涵盖 16 个类别的可运行演示，包括柱形图／条形图、折线图／面积图、饼图／圆环图、地图、层级结构、流程、雷达图／极坐标图、股票图表、仪表盘、甘特图、时间线等
• 1,300 多个 API 参考页面——涵盖 amCharts 5 库中的每个类、接口和函数，根据该版本的类型定义生成：包含实际默认值（包括主题规则）的设置、事件、属性、数据项字段、继承链和导入语句
• 670 多个地理数据条目——涵盖 @amcharts/amcharts5-geodata 中的每张地图，供 list_geodata 使用
• 精选技能参考——来自 amCharts 5 AI Skill 的快速入门模板和图表专属指南

安全

• 只读工具。 每个工具都会读取随附的 amCharts 文档并返回文本。没有工具会写入文件、运行命令或获取 URL。
• 托管端点按设计无需身份验证。 https://mcp.amcharts.com/mcp 提供与 amcharts.com 相同的公开文档。它不涉及账户、API 密钥、用户数据或写入操作。
  • 它运行在 Cloudflare Workers 上。
  • MCP 会话状态保存在 Durable Object 中，这是 MCP agents 框架所要求的。会话结束时，或距离上次请求 24 小时后，状态会被删除。
  • 每个请求的日志（Workers 调用日志）已关闭。只记录错误消息，且其中不包含任何工具参数。请参阅下方的“隐私”。
• 本地安装。 npm 包在你的计算机上通过 stdio 运行，仅读取包内附带的内容；不会发出网络请求。它仅有的运行时依赖项是 @modelcontextprotocol/sdk 和 zod。
• 维护者脚本。 scripts/ 中的脚本（演示和文档抓取器、API 参考生成器）不属于 npm 包，也不会在服务中运行。
• 报告漏洞： https://www.amcharts.com/report-vulnerability/

隐私

托管服务和 npm 包都不需要账户，也不会索取个人数据。

• 托管服务（https://mcp.amcharts.com/mcp）：
  • **你的 AI 应用会发送的内容：**搜索短语、图表类型、文档路径。这些内容仅用于生成答案，不会记录或存储。响应仅会保留在会话存储中，直到送达（以便中断的流可以恢复），之后便会删除。
  • **会话记录：**AI 应用连接时，服务会将其 MCP 初始化消息保存在会话存储中。该消息包含应用对自身的描述（名称、版本及其提供的其他信息）、协议版本和应用的 MCP 功能。应用结束会话时，或距离上次请求 24 小时后，会话存储中的所有内容都会被删除。
  • **日志：**服务不会保留请求日志（Workers 调用日志已关闭）。服务运行在 Cloudflare Workers 上，Cloudflare 会处理每个请求（包括其 IP 地址）以便传递请求。错误和警告消息会被记录并保留最多 7 天；其中不包含请求内容或工具参数。
• **npm 包：**它在你的计算机上通过 stdio 运行，不会向 amCharts 或其他任何人发送任何内容。
• **政策与问题：**请参阅 amCharts 隐私政策，或发送邮件至 [email protected]。

许可证

MIT