マインドマップ

無料のマインドマップ作成ツール。キーボードで枝を追加、ドラッグで整理、自動保存、PNG・SVG・JSONで書き出し、共有リンクも作れます。登録不要、データ送信なし。

  • 自動保存
  • リンクで共有
  • 画像で書き出し
  • スマホ対応
⋯ その他

操作方法(キーボードとマウス)
  • ノードをダブルクリックまたは F2:文字を編集
  • Tab:子ノードを追加
  • Enter:下に兄弟ノードを追加、Shift+Enter:上に追加
  • Ctrl+Enter:上に親ノードを挿入
  • Delete:選択したノードを削除
  • 矢印キー:選択を移動、Alt+↑↓:兄弟ノードの順番を変更
  • ノードを別のノードにドラッグ:位置と階層を変更
  • Ctrl+C/V/X:ノードのコピー、貼り付け、切り取り
  • Ctrl+Z:元に戻す、Ctrl+Shift+Z:やり直す
  • Ctrl+=/-:拡大縮小、Ctrl+0:倍率をリセット
  • F1:中央に戻る、Esc:キャンバスから離れる
  • スペースキーを押しながら、または右ボタンでドラッグ:表示を移動
  • 空いている所を左ボタンでドラッグ:複数のノードを選択
  • ノードを右クリック:関連線、要約、集中モードなど

スマホ・タブレット

  • ノードをタップ:選択、ダブルタップ:文字を編集
  • 1本指でドラッグ:表示を移動、2本指でピンチ:拡大縮小
  • ノードを約0.5秒長押ししてからドラッグ:ノードを移動
  • キャンバス上のボタンでノードの追加・編集・削除、右下のツールバーで中央に戻す・拡大縮小

マインドマップはこのブラウザにだけ自動保存され、アップロードされません。ブラウザのデータを消去すると消えるので、大事な内容は書き出して保管してください。

🔒 計算はすべてブラウザ内で行われ、データがサーバーに送信されることはありません。

こんなときに使えます

  • 勉強ノート・試験前のまとめ:章ごとの要点をツリー状に描けば、項目どうしの関係がひと目でわかります。
  • ブレインストーミング・企画のアイデア出し:まず中心テーマを書き、Tab と Enter でどんどんアイデアを広げられます。
  • プロジェクト・イベントの計画:タスクを分解して担当者を割り振り、「共有リンクをコピー」でチームに送れます。
  • プレゼン・授業:「PNG書き出し」や「SVG書き出し」で画像にして、スライドや配布資料に入れられます。

使い方

  1. ノードを選んで Tab で子ノード、Enter で兄弟ノードを追加し、ダブルクリックか F2 で文字を編集します。スマホではキャンバス上の「+子」「+兄弟」「編集」「削除」ボタンを使います。
  2. ノードを別のノードにドラッグすると階層や順番を変えられます。ノードを右クリックすると関連線、要約、集中モードが使えます。「レイアウト」で左右・右・左・下向きを切り替えられます。
  3. 変更はこのブラウザに自動保存され、次に開いたときに続きから編集できます。バックアップや別の端末へ移すときは「JSON書き出し」と「JSON読み込み」、共有や印刷には PNG か SVG で書き出します。

使用例

「勉強計画」マップを読み込む例:3つの子ノードのうち「数学」に https リンク、「英語」に外部 URL の画像、「ノート」に独自 HTML と javascript: で始まるリンクがあり、関連線が2本、うち1本は存在しないノード history を指しています。読み込むと「4件を除外」と表示されます。内訳は外部画像、独自 HTML、javascript: リンク、切れた関連線が1件ずつで、4つのノードの文字、数学のリンク、もう1本の関連線は残ります。

手書きの JSON では id が抜けがちです。中心トピック Root と子ノード A に id がなく、B の id が空白入りの「x y」、C の id が c で、「x y」から c への関連線があるとします。読み込むと Root、A、B に順に n1、n2、n3 が付き、C は c のまま、関連線は n3 から c へ自動で付け替えられ、除外される内容はありません。

結果の見方

  • ステータスに「このブラウザに自動保存しました」と出ていれば最新の内容が保存されています。「保存できません」と出た場合はプライベートモードかサイトデータがブロックされていることが多く、ページを閉じると内容が消えるので、すぐに JSON で書き出してください。
  • 読み込み後の「N件を除外」は安全のために取り除いた数で、エラーではありません。「読み込みに失敗」と出た場合はファイルはまったく反映されず、今のマップはそのままです。
  • 書き出す PNG・SVG は今のライト/ダークの配色になります。白い背景にしたいときは先にライトモードに切り替えてください。ファイル名は中心トピックからファイル名に使えない記号を除いたもので、「2026 計画: Q1/Q2?」なら「2026 計画 Q1 Q2.png」になります。

仕組みと計算方法

  • エディターはオープンソースの Mind Elixir 5.15.1 で、レイアウト、ドラッグ、元に戻す操作はすべてブラウザ内で動きます。データは JSON で、nodeData が中心トピック、children が子ノードの配列、arrows と summaries が関連線と要約です。
  • 読み込み時はまず JSON の規格どおりに解析し(先頭の BOM は無視)、次にノードを1つずつ確認します。各ノードには文字の topic が必要で、ない場合はエラーの位置を示します。id がない、重複している、英数字・アンダースコア・ハイフン以外を含む場合は新しい id に置き換え、関連線と要約も合わせて付け替えます。
  • 許可リストの項目だけを残します。独自 HTML は常に削除、画像はファイルに埋め込まれた data:image のみ、リンクは http・https・mailto のみ、スタイルはフォント、色、背景、太さ、幅、枠線などで url() を含まないものに限ります。文字はすべてエスケープしてプレーンテキストとして表示し、HTML として実行されないようにしています。
  • 編集のたびに0.4秒後に localStorage(キー pockez:mind-map)へ自動保存し、保存するのは今の1つだけです。配色はサイトのライト/ダークモードに合わせて切り替わり、ノードの文字と背景のコントラストは4.5:1以上、枝の線とキャンバスは3:1以上です。

注意点と制限

  • 保存できるマップは1つだけです。「新規」やファイルの読み込みで今の内容は置き換わるので、複数残したいときはそれぞれ JSON で書き出してください。
  • ファイルは5 MB、5000ノード、100階層までで、超えると理由を表示して読み込みを中止します。
  • 外部 URL の画像は読み込まず(ほかのサイトに接続しないため)、JSON に埋め込まれた画像だけを表示します。画像の書き出しは Mind Elixir の標準機能を使っており、今後のバージョンで変わる可能性があります。
  • スマホやタブレットではキーボードショートカットが使えず、右クリックメニューの関連線、要約、集中モードは機種によって開けないため、これらの機能はパソコンでの操作をおすすめします。

よくある質問

マインドマップはどこに保存されますか?アップロードされますか?

この端末のブラウザ(localStorage)にだけ保存され、サーバーには送信されません。ブラウザのデータを消去したり、プライベートモードや別の端末で開いたりすると見られないので、大事な内容は「JSON書き出し」でバックアップしてください。

ほかのマインドマップアプリのファイルを読み込めますか?

読み込めるのは Mind Elixir 形式の JSON だけで、このツールが書き出す形式です。XMind や FreeMind など他のアプリ独自のファイルはそのままでは読み込めません。

読み込んだら一部の内容が消えたのはなぜですか?

安全のため、ノード内の独自 HTML、外部 URL の画像、http・https・mailto 以外のリンク、存在しないノードを指す関連線を取り除きます。いくつ除外したかはメッセージに表示されます。ノードの文字とツリー構造はすべて残ります。

スマホでも使えますか?

使えます。タップで選択、ダブルタップで編集、1本指のドラッグで移動、2本指のピンチで拡大縮小、ノードを約0.5秒長押ししてからドラッグするとノードを動かせます。追加と削除はキャンバス上のボタンで行います。大きなマップはパソコンでの編集がおすすめです。

マインドマップを人に共有するには?

「共有リンクをコピー」を押すと、マップ全体が圧縮されてURLの「#」以降に入り、相手は開くだけで表示し、自分のブラウザで続けて編集できます。この部分はサーバーに送信されません。リンクはその時点のスナップショットで、後の変更は反映されません。ノードが多すぎてリンクが長くなる場合は、JSONの書き出しで共有するよう案内します。

マインドマップを PDF で保存できますか?

現在書き出せるのは PNG、SVG、JSON です。PDF が必要な場合は、PNG か SVG を文書やスライドに挿入してから PDF として保存してください。

わかりやすいマインドマップの書き方は?

中心にテーマを置き、1段目には 3〜7 個の主な分類を並べ、各ノードはできるだけ短い言葉にします。同じ階層には同じ種類の項目をそろえ、最後に枝をまたぐ関係を関連線で示すと見やすくなります。

別のパソコンで続きを編集するには?

元のパソコンで「JSON書き出し」を押し、新しいパソコンで「JSON読み込み」から読み込みます。または「共有リンクをコピー」して、新しいパソコンでそのリンクを開いても読み込めます。

参考資料