ditaa を使って図を描く

◆ はじめに

先日 mermaid を使った図を描く話をブログに書いたが、
もっと良いツール ditaa を大学時代の先生から教えてもらったので、メモ。

◆ ditaa とは

ditaa(DIagrams Through Ascii Art) とは、アスキーアートで書かれた図を画像に変換するツール。
ちなみに、Java で作成されている。詳細は、作者の Github を参照。
https://github.com/stathissideris/ditaa:embed

◆ 構築環境

• Windows 10

◆ 手順

1. Java のインストール

ditaa 自体は、jar ファイルで提供されているので、動作させるために Java 実行環境が必要。
Java 1.5 以上であれば動作する。

1. パッケージマネージャ Chocolatey のインストール
2. choco コマンドで Java をインストール

$ choco install java

2. ツールのダウンロード

以下 URL からツールをダウンロードする。
本家版だと、日本語を入力する場合は一文字ごとに半角スペースいれないと図が崩れてしまう。
なので、日本語対応版のものをダウンロードする。
https://github.com/luozengbin/dot.emacs.d/raw/master/extra/org-ditaa/jditaa.jar

3. bat ファイルの作成

ツール実行時に、毎回 Java コマンド打つのが面倒なので、bat ファイル化してしまう。
環境変数への追加もお忘れなく。

ditaa.bat

@echo off
set jar=%~dp0jditaa.jar
java -Dfile.encoding=UTF-8 -jar %jar% %*

4. 変換元ファイルの作成

変換元ファイルは、テキストファイルとして作成する。
ただし、文字コードは UTF-8 で作成しないと変換後に文字化けしてしまう。

+--------+   +-------+    +-------+
|        | --+ ditaa +--> |       |
|  Text  |   +-------+    |diagram|
| 日本語 |   |!magic!|    |       |
|     {d}|   |       |    |       |
+---+----+   +-------+    +-------+
    :                         ^
    |       Lots of work      |
    +-------------------------+

5. 画像変換

ここまでできたら後はツールで変換するだけ。

$ ditaa test.txt test.png

test.png

◆ まとめ

すごい便利。いろいろツール試したけど、やっぱり表現力が一番高いのは ditaa だった。
普通に仕事で活用できると思うので、皆様もぜひ。