使用AI MCP动态生成 <img src="https://mermaid.js.org/favicon.svg" height="14"/> mermaid 图表。您也可以使用 <img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZFK8SrovcqgAAAAAAAAAAAAAemJ7AQ/original" height="14"/> mcp-server-chart 来生成图表、图形和地图。
完全支持所有 Mermaid 的特性和语法。
支持配置 backgroundColor 和 theme,使大型AI模型能够输出丰富的样式配置。
支持导出到 base64、svg、mermaid、file 和远程友好的 svg_url、png_url 格式,并对 Mermaid 进行验证,以方便模型多轮输出正确的语法和图形。使用 outputType: "file" 可自动将PNG图表保存到磁盘供AI代理使用,或使用URL模式通过公共的mermaid.ink链接分享图表。
要在桌面应用中使用,如Claude、VSCode、Cline、Cherry Studio等,请添加以下MCP服务器配置。在Mac系统上:
{
"mcpServers": {
"mcp-mermaid": {
"command": "npx",
"args": [
"-y",
"mcp-mermaid"
]
}
}
}
在Windows系统上:
{
"mcpServers": {
"mcp-mermaid": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"mcp-mermaid"
]
}
}
}
您还可以在阿里云、模型库、glama.ai、smithery.ai或其他平台上使用HTTP或SSE协议。
全局安装包:
npm install -g mcp-mermaid
使用您喜欢的传输选项运行服务器:
# 对于SSE传输(默认端点:/sse)
mcp-mermaid -t sse
# 对于自定义端点的流传输
mcp-mermaid -t streamable
如果您正在本地使用源代码:
# 克隆并设置
git clone https://github.com/hustcc/mcp-mermaid.git
cd mcp-mermaid
npm install
npm run build
# 使用npm脚本运行
npm run start:sse # 在3033端口上的SSE传输
npm run start:streamable # 在1122端口上的流传输
然后您可以访问服务器:
http://localhost:3033/ssehttp://localhost:1122/mcp(本地)或 http://localhost:3033/mcp(全局)运行MCP服务器时,您还可以使用以下CLI选项。通过运行cli并使用 -h 查看命令选项。
MCP Mermaid CLI
选项:
--transport, -t 指定传输协议:"stdio"、"sse" 或 "streamable"(默认:"stdio")
--port, -p 指定SSE或流传输的端口(默认:3033)
--endpoint, -e 指定传输的端点:
- 对于SSE,默认是"/sse"
- 对于流传输,默认是"/mcp"
--help, -h 显示此帮助信息
安装依赖:
npm install
构建服务器:
npm run build
使用MCP Inspector(用于调试):
npm run start
使用不同的传输协议:
# SSE传输(服务器发送事件)
npm run start:sse
# 流传输HTTP
npm run start:streamable
直接使用node命令:
# 在3033端口上的SSE传输
node build/index.js --transport sse --port 3033
# 在1122端口上的流传输HTTP
node build/index.js --transport streamable --port 1122
# STDIO传输(用于MCP客户端集成)
node build/index.js --transport stdio
MIT@hustcc.