HM

hustcc/mcp-mermaid

开发工具

本页由 AI 翻译,技术细节请以原文为准。 查看原文

646 stars 60 forks 质量 78 趋势 25MIT

❤️ 用 AI MCP 动态生成美人鱼图和图表。

概览

- 🖼️ figure.ling.pub/gallery 浏览和分享使用 MCP-Mermaid 及其他工具创建的 AI 生成图表和图形。 - 完全支持美人鱼的所有功能和语法。- 支持背景颜色和主题配置,使大型AI模型能够输出丰富的样式配置。 - 支持导出为base64、svg、mermaid、file及远程友好的svg_url、png_url格式,并支持Mermaid验证,以支持模型多轮正确语法和图形输出。使用outputType: “file”自动将PNG图保存到磁盘供AI代理使用,或使用URL模式通过公开mermaid.ink链接分享图示。 如需配合桌面应用(如 Claude、VSCode、Cline、Cherry Studio 等)使用,请在下方添加 MCP 服务器配置。在 Mac 系统上: 另外,你也可以用它在aliyun、modelscope、glama.ai、smithery.ai 或其他带有HTTP、SSE协议的平台上使用。

概述(AI 翻译)

用 AI MCP 动态生成美人鱼图和图表。你还可以使用:

  • mcp-server-chart 用于生成图表、图表、地图。
  • 用于生成信息图,如Timeline、Comparison、List、Process等。
  • 🖼️ figure.ling.pub/gallery 浏览和分享使用 MCP-Mermaid 及其他工具创建的 AI 生成图表和图形。

✨ 特色

  • 完全支持 Mermaid 的所有功能和语法。

  • 支持配置backgroundColor和theme,使大型AI模型能够输出丰富的样式配置。

  • 支持导出为base64、svg、mermaid、file以及远程友好的svg_url、png_url格式,并支持Mermaid的验证,以促进模型多轮正确语法和图形输出。使用outputType: "file"自动保存PNG图到磁盘供AI代理使用,或使用URL模式通过mermaid.ink的公共链接分享图示。

🤖 用途

要与 Desktop APP,如 Claude、VSCode、Cline、Cherry Studio 等使用,请在下方添加 MCP 服务器配置。在 Mac 系统上:

在Windows系统上:

另外,你也可以用它在aliyun、modelscope、glama.ai、smithery.ai 或其他带有HTTP、SSE协议的平台上使用。

本页由 AI 翻译,技术细节请以原文为准。

README

以下为原文 README 节选,完整内容请查看原文。

MCP Mermaid

Generate mermaid diagram and chart with AI MCP dynamically. Also you can use:

  • mcp-server-chart to generate chart, graph, map.
  • Infographic to generate infographic, such as Timeline, Comparison, List, Process and so on.
  • 🖼️ figure.ling.pub/gallery to browse and share AI-generated diagrams and figures created with mcp-mermaid and other tools.

✨ Features

  • Fully support all features and syntax of Mermaid.

  • Support configuration of backgroundColor and theme, enabling large AI models to output rich style configurations.

  • Support exporting to base64, svg, mermaid, file, and remote-friendly svg_url, png_url formats, with validation for Mermaid to facilitate the model’s multi-round output of correct syntax and graphics. Use outputType: "file" to automatically save PNG diagrams to disk for AI agents, or the URL modes to share diagrams through public mermaid.ink links.

🤖 Usage

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-mermaid": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-mermaid"
      ]
    }
  }
}

On Window system:

{
  "mcpServers": {
    "mcp-mermaid": {
      "command": "cmd",
      "args": [
        "/c",
        "npx",
        "-y",
        "mcp-mermaid"
      ]
    }
  }
}

Also, you can use it on aliyun, modelscope, glama.ai, smithery.ai or others with HTTP, SSE Protocol.

Access Points:

  • SSE: http://localhost:3033/sse
  • Streamable: http://localhost:1122/mcp

Available Docker Tags:

  • susuperli/mcp-mermaid:latest - Latest stable version
在 GitHub 查看完整 README

安装

npx -y mcp-mermaid
新手?先看 mcpskill.org 教程 →

配置

{ "mcpServers": { "mcp-mermaid": { "command": "npx", "args": [ "-y", "mcp-mermaid" ] } } }