はじめに
VSCodeのCUIでPlantUMLのPUファイルからPNG、SVG、PDFに変換するやりかたをまとめておきます。
CUIはPwerShellでコマンド実行します。
ネットには方法を説明したたくさんのドキュメントがありますが、環境設定など複雑なものが多いような気がします。
以下のような変換を説明します。
・plantuml.jarでPUファイルをPNGに変換する。(PU → PNG)
・plantuml.jarでPUファイルをSVGに変換する。(PU → SVG)
・SVGからInkscapeを利用してPDFに変換する。 (SVG → PDF)
前提
- Windows 7 以上のOS
- VSCode(Visual Studio Code)インストール済み
- JRE(Java Runtime Environment)またJDK(Java Development Kit)がインストール済みかつjavaコマンドがCUIで実行可能
- VSCodeの拡張機能でPlantUMLをインストール済み(2.14.2)、PUファイルのプレビューに利用
- VSCodeの拡張機能でSVGをインストール済み(1.4.5)、SVGファイルのプレビューに利用
- plantuml.jarをダウンロードしてPCの任意のディレクトリに配置済み、PUファイルからPNGおよびSVG変換に利用
- Inkscapeインストール済み、SVGからPDF変換に利用
変換元のPUファイル
変換するPlantUMLのルPUファイルとして下記のフローチャートを用意しました。
test.pu
@startuml
(*) --> "前処理1"
if "NG" then
-->[true] "Error Message"
else
-->[false] "前処理2"
if "NG" then
-->[true] "Error Message"
--> (*)
else
-->[false] "Main処理"
-->"ファイル取得"
-->"ファイル変換"
-->"ファイル出力"
--> (*)
endif
endif
@enduml
PlantUMLのプレビューでtest.pu表示
PUファイルをPNGに変換
変換するPUファイルと同じディレクトリにplantuml.jarを配置するとコマンドでパス指定がなくなるので簡便。
下記のコマンドを実行します。
java -jar .\plantuml.jar .\test.pu -charset UTF-8
| パラメータ | 説明 |
|---|---|
| test.pu | PUファイル |
| -charset | 文字コード (UTF-8を指定) |
PUファイルと同じディレクトリにtest.pngが作成されます。
test.png
PUファイルをSVGに変換
下記のコマンドを実行します。PNGとの違いは**-svg**を指定します。
java -jar .\plantuml.jar -svg .\test.pu -charset UTF-8
| パラメータ | 説明 |
|---|---|
| -svg | 変換ファイルSVG |
| test.pu | PUファイル |
| -charset | 文字コード (UTF-8を指定) |
PUファイルと同じディレクトリにtest.svgが作成されます。
SVGのプレビューでtest.svg表示
SVGファイルをPDFに変換
変換するSVGファイルのディレクトリにCUIのディレクトリを変更後、Inkscapeのbinのパスを環境変数のPathに設定します。
cd C:\SVGファイルのディレクトリ
Set-Item Env:Path "$Env:Path;C:\Program Files\Inkscape\bin"
※システム環境変数のPathに設定でもよい（パス指定を省略できる）
下記のコマンドを実行します。
inkscape -z test.svg test.pdf -w 200 -h 200
| パラメータ | 説明 |
|---|---|
| -z | InkscapeのGUIを非表示 |
| test.svg | 入力SVGファイル |
| test.pdf | 出力PDFファイル |
| -w | PDFファイルの幅(例:200) |
| -h | PDFファイルの高さ(例:200) |
SVGファイルと同じディレクトリにtest.pdfが作成されます。
test.pdf
コラム
下記のようなエラーの場合、実行しているユーザの権限がディレクトリに対してtest.pdfファイルを作成できない状態です。
権限のあるユーザで実行するか、あらかじめtest.pdfをIkscapeのGUIで作成済みにすることで上書きできます。
** Message: 15:14:54.121: couldn't open the PDF file.
** (org.inkscape.Inkscape:15276): WARNING **: 15:14:54.132: Can't open file: C:\Users\～\test.pdf (doesn't exist)
ink_file_open: 'C:\Users\～\test.pdf' cannot be opened!
InkscapeApplication::document_open: Failed to open: C:\Users\～\test.pdf
ConcreteInkscapeApplication::on_open: failed to create document!
まとめ
PlantUMLはフローチャート、シーケンス図、クラス図など多種多様な作図ができる強力なツールです。
VSCodeを利用してPlantUML図作成後、他のドキュメントへ展開するために、PNGやPDFファイルの変換が必要となります。
特にPNGに変換するとOfficeなどのドキュメントでそのまま使えます。
私が普段変換しているやり方をまとめました。（備忘録）
もっと簡単な方法があるかもしれません。