2軸4象限のマトリクス図（ポジショニングマップ）を GUI で作成。図をクリック / ドラッグすると
Mermaid quadrantChart 記法が自動生成されます。テキストを直接編集しても図に反映される双方向エディタです。
※ 画像アイコンは本ツールの図（PNG / SVG 出力）にのみ描画されます。Mermaid の quadrantChart
記法は画像に対応していないため、コード上は %%icon: コメント（Mermaid は無視）として保持されます。
空きエリアをクリックで追加 / 点をクリックで選択 / ドラッグで移動
画像はまだありません。追加して、点を選択した状態でサムネイルをクリックすると割り当てられます。
画像はブラウザ内（ローカル）にのみ保存され、Mermaid コードや共有 URL には含まれません。
コードを入力すると Mermaid でのレンダリング結果が表示されます。
Mermaid 本体でレンダリングした場合の見た目です（画像アイコンは表示されません）。
| 行 | 意味 | 例 |
|---|---|---|
title |
図のタイトル | title ひと夏の想い出 早見シート |
x-axis |
X 軸ラベル（左 --> 右。右側は省略可） | x-axis 想いを伝えられない --> 感情大爆発 |
y-axis |
Y 軸ラベル（下 --> 上。上側は省略可） | y-axis 友達 --> 恋人 |
quadrant-1〜4 |
象限ラベル（1=右上, 2=左上, 3=左下, 4=右下） | quadrant-1 今すぐやる |
| 点 | 名前と座標（0〜1）。スタイルは任意 | 項目A: [0.3, 0.6] radius: 12, color: #ff5588 |
%%icon: |
本ツール独自の画像割り当てコメント（Mermaid は無視） | %%icon: 項目A icon_01 |
%%bg-color: / %%bg-image: |
背景レイヤーの色 / 背景画像の使用（本ツール独自） | %%bg-color: #0b1a3a |
%%plot-opacity: |
グラフレイヤーの塗りの不透明度 0〜1（本ツール独自） | %%plot-opacity: 0.7 |
%%layer-hide: |
非表示レイヤー（bg / graph / icons / labels。本ツール独自） | %%layer-hide: labels |
Y 座標は 0 が下・1 が上です。classDef などその他の行は編集しても保持されます。
このツールは、2軸4象限のマトリクス図（ポジショニングマップ・推しマップ・相関シートなど）をブラウザ上で作成するためのものです。 Mermaid の quadrantChart 記法と相互変換できるため、作成した図を Markdown ドキュメントにコードとして埋め込むこともできます。 アップロードした画像を含め、すべての処理はローカルで実行され、データが外部に送信されることはありません。