tl;dr

処理の流れを図示したい時に Cacoo でシーケンス図っぽい図を書いていたのだけど、子供の落書きみたいな出来上がりになって落ち込んでいたら seqdiag というツールを見つけたので使ってみたらテキストでサクッとシーケンス図が書けるのがとても気持ち良かったのでメモ。

テキストで書けるということは Git 等での管理もしやすくなるし、それによって複数人での管理がしやすくなる。また、テキストで書くと言っても、難解なスクリプトのようではなくて、直感的な書き方で出来上がりの図をある程度想像しながら書けるのも嬉しかった。尚、ドキュメントも充実しており悩むことなく始められたのも更に嬉しかった。

メモ

試した環境

% sw_vers
ProductName:    Mac OS X
ProductVersion: 10.11.1
BuildVersion:   15B22c

% pip --version
pip 1.4.1 from /opt/boxen/homebrew/lib/python2.7/site-packages/pip-1.4.1-py2.7.egg (python 2.7)

インストール

pip にてインストールする

pip install seqdiag

ヘルプ確認。

% seqdiag --help
Usage: seqdiag [options] infile

Options:
  --version             show program's version number and exit
  -h, --help            show this help message and exit
  -a, --antialias       Pass diagram image to anti-alias filter
  -c FILE, --config=FILE
                        read configurations from FILE
  --debug               Enable debug mode
  -o FILE               write diagram to FILE
  -f FONT, --font=FONT  use FONT to draw diagram
  --fontmap=FONT        use FONTMAP file to draw diagram
  --no-transparency     do not make transparent background of diagram (PNG
                        only)
  --size=SIZE           Size of diagram (ex. 320x240)
  -T TYPE               Output diagram as TYPE format
  --nodoctype           Do not output doctype definition tags (SVG only)

バージョン確認。

% seqdiag --version
seqdiag 0.9.5

サンプル

ドキュメントに出力サンプルが多数掲載されているのでそちらを眺めているとサクッと書けるようになると思うが、試しに食べ物を口にして便になるまでのシーケンスを書いてみた。

% cat sample1.diag
seqdiag {
  # フォントサイズを指定
  default_fontsize = 14;

  口 -> 食道 [label = "そしゃく"];
  食道 -> 胃;
  胃 -> 十二指腸 [label = "酸性の消化液により消化"];
  十二指腸 -> 小腸 [label = "胆汁や膵液と混ざる"];
  肝臓  大腸 [label = "繊維質や水分", leftnote = "小腸にてn栄養素と水分の 80% が吸収"];
  大腸 -> 肛門 [label = "残りかすは水分が吸収され便となる"]
}

このテキストを以下のように引数として seqdiag を実行する。

% seqdiag -f /Library/Fonts/ヒラギノ丸ゴ ProN W4.ttc sample1.diag

-f オプションでフォントの指定が出来る。

実行すると同じディレクトリに sample1.png というテキストファイルと同じ名前の画像ファイルが出来る。

% ls -l sample1.*
-rw-r--r--  1 kappa  staff    542 Oct 23 07:57 sample1.diag
-rw-r--r--@ 1 kappa  staff  22424 Oct 23 07:57 sample1.png

この sample1.png を開くと以下のようなシーケンス図が表示される。

20151023080215

おお、お手軽。

ということで

上記のサンプル以外にも全体的な設定や複数のエッジ(矢印)が書けたりするので、凝ったシーケンス図がテキストでお手軽に書けるのではないかと思う。

以上。

元記事はこちら

(超メモ)テキストでシーケンス図が書ける seqdiag が気持ち良かったのでメモ