Markdown AIにMermaidが追加！

2024年12月9日、Markdown AIに新たな機能として 「Mermaid記法」 が追加されました！これにより、 簡単にグラフやチャート、シーケンス図などを作成・共有できるようになりました。

Mermaid記法とは？

Mermaid記法は、フローチャート、ガントチャート、シーケンス図、パイチャートなどをテキストベースで簡単に作成できる記法です。
これを使えば、PowerPointなどのツールを使用しなくても文言だけで簡単に図などを制作できます。

例えば、

```mermaid
pie
    title Resource Allocation
    "Development": 40
    "Marketing": 25
    "Operations": 20
    "Management": 15
```

上記をMarkdown AIに記述すると、以下のようなグラフが生成されます。

このように、簡単な記述で視覚的にわかりやすい資料を作ることができます！

Mermaidの簡単なルール

ルール１：
頭にバッククオート（`）３つとmermaidと記述、終わりにバッククオート（`）３つ

```mermaid
<ここに内容を書く>
```

ルール2：何の図を書くかを最初に書く
フローチャート → graph
シーケンス図 → sequenceDiagram
ガントチャート → gantt
パイチャート → pie

ルール3：箱（ノード）を作る
四角い箱: A[これが四角い箱表記]
ダイヤモンド（条件分岐）: B{ここで分岐}

ルール4：箱と箱をつなぐ矢印を書く
矢印を書くときは、--> を使う。
例： A --> B

ルール5：説明を足す
矢印に「はい」や「いいえ」をつけたいとき：
A -- はい --> B

Mermaidの基本的な使い方は以上になります！
より詳しい使い方を学びたい場合は、下記の記事が参考になるので、読んでみて下さい。
執筆者：@opengl-8080さん

Mermaidで作成できる図の種類

Mermaid記法を使うと、さまざまな図が作成できます！

フローチャート（Flowchart）

用途:
プロセスやワークフロー、条件分岐の流れを視覚化するのに使用します。
※graphの後の「TD」は（Top to Down）の略で、上から下へ」の流れ（縦向き）を意味します。

```mermaid
graph TD;
    A[開始] --> B{条件};
    B -- はい --> C[処理1];
    B -- いいえ --> D[処理2];
    C --> E[終了];
    D --> E[終了];
```

2. シーケンス図（Sequence Diagram）

用途:
システム間や参加者間のやり取り（メッセージの流れ）を表現します。APIの通信やユーザーとサーバーのやり取りを説明するのに便利です。

```mermaid
sequenceDiagram
    participant A as ユーザー
    participant B as サーバー
    A->>B: データをリクエスト
    B-->>A: データを返す
```

ガントチャート（Gantt Chart）

用途:
プロジェクト計画やタスクスケジュールを視覚的に管理します。

```mermaid
gantt
    title プロジェクト計画
    section 準備
    設計: done, des1, 2024-01-01, 3d
    開発: active, dev1, after des1, 10d
    テスト: test1, after dev1, 5d
```

パイチャート（Pie Chart）

用途:
データの割合を視覚化するのに使用します。

```mermaid
pie
    title 予算配分
    "開発": 40
    "マーケティング": 30
    "運用": 20
    "管理": 10
```

Markdown AIでのMermaidの使い方

Markdown AIでMermaid記法を使用する際も上記と一緒の記述で図が作成できます！

Mermaid記法のメリット

シンプルで直感的な記法：HTMLやグラフィックソフトを使わずに図を作成可能
動的なデータ対応：数値を変更するだけで即座に更新
ドキュメントの一貫性：Markdown形式でコードと図を一元管理できる
視覚的にわかりやすい：チーム内の情報共有がスムーズに

最後に

今回アップデートでMarkdown AIは、より実務でも使いやすく進化しました！
技術資料や計画書を作成しやすくなったので、ぜひMarkdown AIでMermaid記法を試してみてください！

【Markdwon AI公式ツール】