/ ディレクトリ / プレイグラウンド / Markmap MCP Server
● コミュニティ jinzcdev ⚡ 即起動

Markmap MCP Server

作者 jinzcdev · jinzcdev/markmap-mcp-server

ツール呼び出し 1 つで、任意の Markdown アウトラインをインタラクティブなマインド マップに変換します (パン、折りたたみ、PNG/JPG/SVG のエクスポート)。

markmap-mcp-server は、オープンソースのマークマップ レンダラーを MCP ツールとしてラップします。 ネストされた見出しまたは箇条書きリストを含む Markdown をフィードし、ブラウザーで開き (自動起動可能)、PNG / JPG / SVG にエクスポートする HTML マインド マップを取得します。 会議の概要、ブレーンストーミングのキャプチャ、学習メモなど、平らなアウトラインをツリーとして考えやすい場合に便利です。

なぜ使うのか

主な機能

ライブデモ

実際の動作

markmap-mcp-server.replay ▶ 準備完了
0/0

インストール

クライアントを選択

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "markmap-mcp-server": {
      "command": "npx",
      "args": [
        "-y",
        "@jinzcdev/markmap-mcp-server"
      ],
      "env": {
        "MARKMAP_DIR": "/path/to/output"
      }
    }
  }
}

Claude Desktop → Settings → Developer → Edit Config を開く。保存後、アプリを再起動。

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "markmap-mcp-server": {
      "command": "npx",
      "args": [
        "-y",
        "@jinzcdev/markmap-mcp-server"
      ],
      "env": {
        "MARKMAP_DIR": "/path/to/output"
      }
    }
  }
}

Cursor は Claude Desktop と同じ mcpServers スキーマを使用。プロジェクト設定はグローバルより優先。

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "markmap-mcp-server": {
      "command": "npx",
      "args": [
        "-y",
        "@jinzcdev/markmap-mcp-server"
      ],
      "env": {
        "MARKMAP_DIR": "/path/to/output"
      }
    }
  }
}

Cline サイドバーの MCP Servers アイコンをクリックし、"Edit Configuration" を選択。

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "markmap-mcp-server": {
      "command": "npx",
      "args": [
        "-y",
        "@jinzcdev/markmap-mcp-server"
      ],
      "env": {
        "MARKMAP_DIR": "/path/to/output"
      }
    }
  }
}

Claude Desktop と同じ形式。Windsurf を再起動して反映。

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "markmap-mcp-server",
      "command": "npx",
      "args": [
        "-y",
        "@jinzcdev/markmap-mcp-server"
      ]
    }
  ]
}

Continue はマップではなくサーバーオブジェクトの配列を使用。

~/.config/zed/settings.json
{
  "context_servers": {
    "markmap-mcp-server": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "@jinzcdev/markmap-mcp-server"
        ]
      }
    }
  }
}

context_servers に追加。保存時に Zed がホットリロード。

claude mcp add markmap-mcp-server -- npx -y @jinzcdev/markmap-mcp-server

ワンライナー。claude mcp list で確認、claude mcp remove で削除。

ユースケース

実用的な使い方: Markmap MCP Server

会議メモをマインドマップに変換してすばやく共有

👤 メモを大量に使用する同期を実行する PM、チーム リーダー ⏱ ~10 min beginner

使うタイミング: 会議後、単調な箇条書きでは議論の内容が見えにくくなります。

前提条件
  • ノード18+ — nvm インストール 18
フロー
  1. エージェントにマークダウンの草稿を依頼してください
    今日の計画会議を、トップレベルのテーマを含むネストされた Markdown アウトラインとして要約します。✓ コピーしました
    → アウトラインには 3 ~ 5 つのトップテーマとネストされたサブポイントがあります
  2. 与える
    そのアウトラインに対して markdown-to-mindmap を実行し、ブラウザで開きます。✓ コピーしました
    → インタラクティブなマインドマップが開きます。 ノードの折りたたみ/展開
  3. 輸出
    マップを SVG にエクスポートし、そのファイルをチーム ドキュメントにドロップします。✓ コピーしました
    → MARKMAP_DIR に保存された SVG

結果: 会議の言葉だけでなく、その形をコード化した共有可能なマインド マップ。

注意点
  • アウトラインが浅すぎる - すべてがトップレベルのノードになる — 強制ネスト: テーマ → サブポイント → 裏付けとなる事実を尋ねます
組み合わせ: filesystem

教科書の章から学習マップを作成する

👤 学生と生涯学習者 ⏱ ~20 min beginner

使うタイミング: 一章を読んだ後、試験前に確認できる 1 つの画像のビジュアルが必要だとします。

フロー
  1. この章を要約する
    <book> の第 4 章を階層的な Markdown アウトラインとして要約します。✓ コピーしました
    → トピックツリーをクリアする
  2. レンダリングとエクスポート
    マインド マップを作成し、~/study/ に PNG として保存します。✓ コピーしました
    → レビュー用の PNG ファイルの準備ができました

結果: 数秒でスキャンできる視覚的な学習補助ツールです。

組み合わせ: paper-fetch-skill

完全な図を書く前に、非公式のアーキテクチャ マップの草案を作成する

👤 draw.io/figma にコミットする前にスケッチするエンジニア ⏱ ~15 min intermediate

使うタイミング: 必要なのは、洗練されたアーキテクチャ ドキュメントではなく、2 分間の「トーク トラック」図です。

フロー
  1. Markdown でサービスをリストする
    このリポジトリ内のサービスは、ドメインごとにグループ化されたネストされた Markdown ツリーとして概説されます。✓ コピーしました
    → グループ化されたアウトラインはコードベース構造を反映します
  2. 与える
    それをマインドマップに変換し、SVG にエクスポートします。✓ コピーしました
    → デザインドキュメントにドロップできるSVG

結果: トークトラック図を数分で作成。 必要な場合にのみ、後で実際のアーキテクチャ図にアップグレードしてください。

注意点
  • 最終的な成果物として扱う — 思考ツールとして使用してください。 公開する前に正式な図に置き換える
組み合わせ: mermaid-skill

組み合わせ

他のMCPと組み合わせて10倍の力を

markmap-mcp-server + filesystem

長いドキュメントを読み、Markdown アウトラインに要約し、マインド マップとしてレンダリングする

./notes/long-doc.md を読み取り、ネストされたアウトラインを作成し、それをマインド マップとしてレンダリングします。✓ コピーしました
markmap-mcp-server + mermaid-skill

適切なビジュアルを選択します — フローにはマーメイド、階層にはマークマップ

これがフロー (マーメイド) であるか階層 (マークマップ) であるかを決定し、それに応じてレンダリングします。✓ コピーしました
markmap-mcp-server + paper-fetch-skill

論文の要約/セクションを取得し、議論の構造をマッピングする

論文を取り出し、セクションの見出しと要点を抽出し、議論をマインド マップとしてレンダリングします。✓ コピーしました

ツール

このMCPが提供する機能

ツール入力呼び出すタイミングコスト
markdown-to-mindmap markdown: str, open?: bool ネストされた Markdown アウトラインをインタラクティブなマインド マップに変換する 0

コストと制限

運用コスト

APIクォータ
なし — ローカルでレンダリングします
呼び出しあたりのトークン
小:アウトラインサイズ
金額
無料
ヒント
読みやすくするために、アウトラインを最大 100 ノードに抑えます。 大きなマップはパン/エクスポートに時間がかかります。

セキュリティ

権限、シークレット、影響範囲

認証情報の保管: 認証情報なし - オフライン レンダリング
データ送信先: ネットワーク下りはありません。 フォントと JS はローカルにバンドルされています。

トラブルシューティング

よくあるエラーと対処法

ブラウザが開きませんでした

open=false を設定し、返された HTML パスを手動で開きます。 デフォルトのブラウザが登録されていることを確認します。

確認: open $(returned_path) on macOS
エクスポートされた PNG は空白です

エクスポートする前に、マップが完全にレンダリングされるまで少し待ちます。 構成の遅延を増やすか、エクスポートを 2 回実行してください。

確認: Open the HTML in a browser and check it renders before export
MARKMAP_DIR への書き込み権限が拒否されました

MARKMAP_DIR をホーム ディレクトリ内の書き込み可能なパスに指定します。

確認: touch $MARKMAP_DIR/.probe && rm $MARKMAP_DIR/.probe

代替案

Markmap MCP Server 他との比較

代替案代わりに使う場面トレードオフ
mermaid-skillデータは階層ではなくフローまたはシーケンスです異なる図のパラダイム
excalidraw-skill手描きの大まかなビジュアルが必要な場合自動レイアウトはありません。 手動位置決め
antv-chart必要なのはマインドマップではなく統計グラフです異なる出力クラス

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

🔍 400以上のMCPサーバーとSkillsを見る