昔から開発者がビジュアル化のために使ってきたライブラリがGraphvizではないでしょうか。DOT言語と呼ばれる記法に沿って書くことで、画像やSVGとしてドローされたデータを出力できます。 そんなGraphvizのビジュアル化をWeb上で行い、さらに編集まで行えるのがGraphviz Visual Editorです。

Graphviz Visual Editorの使い方

基本的な形。

エンジンはdotだけでなく、fdp/neato/osage/patchwork/twopiから選択できます。

複雑なものでも問題なく描けます。

こんな複雑なものでも瞬時に描画されます。

拡大したり、選択しているノードが左側のエディタでハイライトされます。

図形の追加も可能です。

DOT記法のビジュアル化するツールはよくありますが、Graphviz Visual Editorは編集もできるのが特徴です。どの部分が記法でビジュアル化されているのかも分かりやすく、ビジュアル編集も可能とあって、かなり便利に使えるツールではないでしょうか。

Graphviz Visual EditorはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

Graphviz Visual Editor magjac/graphviz-visual-editor: A web application for interactive visual editing of Graphviz graphs described in the DOT language.