# Mermaid クワドラント図のチートシート

2 本の軸、4 つの象限、そしてその上にプロットされた点。

## 2 本の軸

x-axis と y-axis は、それぞれ低端と高端を持ち、そのあいだに矢印があります。

```mermaid
quadrantChart
    x-axis Low --> High
    y-axis Low --> High
```

![中身のないクワドラント図。横軸と縦軸のそれぞれの一端に Low、もう一端に High とあります。](/diagrams/quadrant/axes.svg)

## 象限に名前をつける

1 行に 1 つの象限です。コロンはありません。行の残り全部がラベルになります。

```mermaid
quadrantChart
    x-axis Low --> High
    y-axis Low --> High
    quadrant-1 We do
    quadrant-2 Invest
    quadrant-3 Improve
    quadrant-4 Ignore
```

![4 つの象限に We do、Invest、Improve、Ignore とラベルされたクワドラント図。](/diagrams/quadrant/quadrants.svg)

## 点をプロットする

点は名前と、0 から 1 のあいだの数字の組です。

```mermaid
quadrantChart
    x-axis Low --> High
    y-axis Low --> High
    Point A: [0.3, 0.6]
    Point B: [0.75, 0.8]
```

![2 点をプロットしたクワドラント図。Point A は右下、Point B は右上です。](/diagrams/quadrant/points.svg)

## タイトルを足す

タイトルは軸より前の 1 行に書きます。

```mermaid
quadrantChart
    title Reach and engagement
    x-axis Low --> High
    y-axis Low --> High
    quadrant-1 We do
    Point A: [0.3, 0.6]
```

![Reach and engagement というタイトルのクワドラント図。We do の象限と、プロットされた点が 1 つあります。](/diagrams/quadrant/title.svg)

## Mernyx で描いてみる

.mmd ファイルを開いて、キャンバスでノードを動かしてみてください。ソースコードもついてきます。macOS ネイティブで、ブラウザは介在しません。