MCP Mermaid

🚀 MCP Mermaid

このプロジェクトは、AI MCPを使って動的にmermaidのダイアグラムやチャートを生成することができます。また、mcp-server-chartを使ってチャート、グラフ、マップを生成することもできます。

🚀 クイックスタート

このプロジェクトを使用するには、以下の手順に従ってください。

✨ 主な機能

• Mermaidのすべての機能と構文を完全にサポートします。
• backgroundColorとthemeの設定をサポートし、大規模AIモデルが豊富なスタイル設定を出力できるようにします。
• png、svg、mermaid形式へのエクスポートをサポートし、Mermaidの検証機能により、モデルが正しい構文とグラフを複数回出力できるようにします。

💻 使用例

基本的な使用法

Desktop APP（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"
      ]
    }
  }
}

また、HTTP、SSEプロトコルを使用して、aliyun、modelscope、glama.ai、smithery.aiなどで使用することもできます。

高度な使用法

SSEまたはStreamableトランスポートで実行するには、まずパッケージをグローバルにインストールします。

npm install -g mcp-mermaid

好みのトランスポートオプションでサーバーを起動します。

# SSEトランスポートの場合（デフォルトエンドポイント: /sse）
mcp-mermaid -t sse

# カスタムエンドポイントでStreamableトランスポートを使用する場合
mcp-mermaid -t streamable

その後、以下のURLでサーバーにアクセスできます。

• SSEトランスポート: http://localhost:3033/sse
• Streamableトランスポート: http://localhost:3033/mcp

🎮 CLIオプション

MCPサーバーを実行する際に、以下のCLIオプションを使用することもできます。コマンドオプションは-hで確認できます。

MCP Mermaid 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

🔧 開発方法

依存関係をインストールします。

npm install

サーバーをビルドします。

npm run build

MCPサーバーを起動します。

npm run start

📄 ライセンス

MIT@hustcc。