ノートやコメントなどの Markdown エディタで、mermaid を指定したコードブロックをダイアグラムとして描画できるようになりました。
フローチャートやシーケンス図などを画像なしでテキストとして記述・共有できます。
1. mermaidコードブロックを書く
コードブロックの言語指定に mermaid を指定すると、ダイアグラムとして認識されます。
例：フローチャート
flowchart LR; A[カート] --> B[購入手続き] --> C[支払い] --> D[注文確定]
その他、シーケンス図・クラス図・ER 図など mermaid 公式がサポートする記法をそのまま利用できます。
2. ダイアグラム / ソースをトグルで切り替える
mermaid コードブロックには ダイアグラム / ソースを切り替えるトグル が表示されます。
▼閲覧時（viewer）: ダイアグラム表示が初期状態。読み手は図として確認
▼編集時（editor）: ソース表示が初期状態で、トグルでプレビューに切り替えて確認
※ 通常のコードブロック（mermaid 以外の言語指定）は従来通りソースのまま表示されます。
3. パースに失敗した場合
mermaid の構文エラーで描画に失敗した場合は、エラーメッセージとともにフォールバック表示されます。
▼ソースに切り替えて記述を見直してください
mermaidダイアグラム表示のご紹介は以上です！
引き続きCoadmapをよろしくお願いします。