概要 先日こちらの記事でgraphvizを使って状態遷移図を作成する方法をご紹介したのですが、これでもまだ複雑で記述量も多いのでとっつきづらいと思い、このgraphvizのソースコードを自動生成して画像を出力するコマンドラインアプリケーションを作成しました。 このアプリケーションはPyagram(ぱいあぐらむ)といい、その名前から察しがつくかと思いますがPythonを使用して開発されました。開発期間は1日でした。 このPyagramを使うことで複雑な状態遷移図を比較的簡単に作成することができるようになりますので、以下でご紹介したいと思います。 状態遷移図の描き方についてはこちらの記事を参考にしています。 出来上がりの図は以下のような感じになります。 図には幾つかのオブジェクトがあります。 図のタイトル(最上段) ビュー(二重丸) サーバサイドの処理(灰色の背景の一重丸) 画面遷移(破線の矢
![Web開発でもアプリ開発でも使える状態遷移図を自動生成するツールを作りました - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/b41e3a3b1446dd99caed8d2a0b292e71b2ff5857/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9V2ViJUU5JTk2JThCJUU3JTk5JUJBJUUzJTgxJUE3JUUzJTgyJTgyJUUzJTgyJUEyJUUzJTgzJTk3JUUzJTgzJUFBJUU5JTk2JThCJUU3JTk5JUJBJUUzJTgxJUE3JUUzJTgyJTgyJUU0JUJEJUJGJUUzJTgxJTg4JUUzJTgyJThCJUU3JThBJUI2JUU2JTg1JThCJUU5JTgxJUI3JUU3JUE3JUJCJUU1JTlCJUIzJUUzJTgyJTkyJUU4JTg3JUFBJUU1JThCJTk1JUU3JTk0JTlGJUU2JTg4JTkwJUUzJTgxJTk5JUUzJTgyJThCJUUzJTgzJTg0JUUzJTgzJUJDJUUzJTgzJUFCJUUzJTgyJTkyJUU0JUJEJTlDJUUzJTgyJThBJUUzJTgxJUJFJUUzJTgxJTk3JUUzJTgxJTlGJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz0yMjVjMGUxYjgwMTA0ZDE2MmNhNjNhYmVlODE4M2FmYg%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBoaWRlc2hpJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0zNTQ5MTJjNWNjNzVmYTZlY2ZhMTA1NzZiNDNhZjRjZA%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Db004c20f28cfa37ace14ce6f058a58cb)