VSCodeの拡張機能「Mermaid Graphical Editor」を試してみました。
準備
VSCodeの拡張機能で「Mermaid Graphical Editor」を検索してインストール。
使い方
拡張子がmdのファイルを開く。もしくは新たに作成する。
次の通り入力する。
```mermaid
```
```
上に「MermaidEditor」と表示される。
これをクリックすると右にMermaid Editorが表示される。
「FLOWCHART」や「SEQUENCE」を選択する。
グラフィカルな編集画面が表示される。
所感
右側のMermaid Editorで編集すると左側にコードが表示されます。
左側を修正すると右側に反映されます。
直感的に編集できてよいです。
試しに既存のシーケンス図のあるmdファイルを開いてコード部分を「“`mermaid〜“`」で挟んだところ正しく表示されました。
なおフローチャートはDOTではありません。
コメント