Grapvhiz, blockdiagのフロントエンドのメモ

  • 5
    いいね
  • 0
    コメント

Grapvhiz, blockdiagのフロントエンド(テキストエディタ付きビューワ)

・テキスト入力領域に入っているテキストを最初のノード名?(digraph {...}, seqdiag {...} )で判断して呼び出すexe(dot, blockdiag, seqdiag)を切り替える。
・結果をSVGで出力し、テキスト入力領域右側の表示画面で表示する。
(・できたらテキスト入力時にインテリセンス的な入力補助がある)
といったものがほしい。

LiveDiag - GitHubが、これに最も近い(+markdownの中に埋め込みもしている様子)が、Mac向けしかなさそう + Grapvizをサポートしてない?

Windowsの場合、フォトビューワ+サクラエディタ+PlantUMLで、テキストエディタ付きビューワ的に使えました(そこそこライブプレビュー的にできる)
エンコーディングはSJIS(CP932)でないと日本語が化けるようです。
※Sublime Textだとシンタックスハイライトしてくれますが、なぜかConvertToUTF8を使っても文字化け。不明。

あまりこだわりすぎないなら、これでいいかなと。
(ツールで可能な表現だけに集中して、図の「芸術」的な調整をあえてしない)

1.PNG

PlantUML

PlantUML _ プログラマーズ雑記帳
AtomとPlantUMLで爆速UMLモデリング - Qiita
PlantUMLで気軽にUML作成 - Qiita
QiitaにUMLを載せられるようにPlantUMLつかってWebサービス作ろうと思ったら本家にあった話 - Qiita
PlantUML Cheat Sheet - Qiita
PlantUML導入手順 - Qiita

blockdiag, seqdiag

LiveDiag - GitHub

Graphviz

Doteditor
GVedit(Windows 用 Graphviz フロントエンド)のバグをなおしてみた - miauの避難所
electronなGraphvizエディタ 'electron-viz' - Qiita
viz.js - GitHub

参考

作図系ツール・ライブラリまとめ - GitHub

Graphviz _ Graphviz - Graph Visualization Software
Graphviz for Windowsにかませるちょっとしたマクロ的な何か - ooharakの日記
Graphviz-win の日本語化 - Tips
Graphvizによるファンクション・コールの視覚化

シーケンス図生成ツール seqdiag — blockdiag 1.0 ドキュメント
複数ノードのパケットキャプチャファイルからシーケンス図を出力するツールを作成した - Qiita

RichTextBox用のインテリセンスを作ってみた
[C#][WPF]インテリセンスみたいなの作れるかな.htm]
インテリセンス付きテキストボックス DOBON.NETプログラミング掲示板過去ログ
CodeTextBox - another RichTextBox control with syntax highlightning and intellisense - CodeProject

emscriptenでC_C++プログラムをwebブラウザから使うまでの難所攻略

ドキュメント書くのを限界までラクにする - Qiita
データのビジュアル化を最少の労力で Graphviz