【Asciidoc】ダイアグラム ー Asciidocの画像オプションが… ー

今回は「PlantUML」の「ダイアグラム」に画像オプションが適用できますよと言う話。

画像オプションについては以前「【Asciidoc】画像を表示する＋稀少？テク？」で紹介しています。
大きさやポジション等紹介しました。
少し整理しておきましょう。

• 大きさ

  • 「width=300」や「height=300」のピクセル指定

  • 「width=25%」の「％」指定

• ポジション

  • 「align=left」等の位置指定（left, center, right が利用できます）

  • 「float=right」等の回り込み指定（left, right が利用できます）

等がありました。

実際に割り当ててみましょう。
まず、何度も利用するので

@startuml
skinparam defaultFontName ZenMaruGothic

actor 夏目漱石


夏目漱石 -> (猫 初期化) : 作成
夏目漱石 -> (猫 名前) : 付ける
夏目漱石 -> (猫 描写) : 表示する

@enduml

「PlantUML」ファイル「wagahai.pu」を用意します。
通常のオプションだけの表現は

= PlantUML 設定

== 画像パラメータ

[plantuml,吾輩は猫,svg]
--
include::wagahai.pu[]

--

変換すると

基本形

さて、大きさを指定してみましょう。

[plantuml,吾輩は猫,svg]
--
include::wagahai.pu[]

--

'''

[plantuml,吾輩は猫2,svg,width=30%]
--
include::wagahai.pu[]

--

変換すると

大きさ指定

上手くいきました。

ポジションと回り込みを試してみましょう。

'''

[plantuml,吾輩は猫3,svg,width=30%,align=left]
--
include::wagahai.pu[]

--

[plantuml,吾輩は猫4,svg,width=30%,align=center]
--
include::wagahai.pu[]

--

[plantuml,吾輩は猫5,svg,width=30%,align=right]
--
include::wagahai.pu[]

--

'''

[plantuml,吾輩は猫6,svg,float=left]
--
include::wagahai.pu[]

--

Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500’lerden beri endüstri standardı sahte metinler olarak kullanılmıştır.


[plantuml,吾輩は猫7,svg,float=right]
--
include::wagahai.pu[]

--

Beşyüz yıl boyunca varlığını sürdürmekle kalmamış, aynı zamanda pek değişmeden elektronik dizgiye de sıçramıştır.1960’larda Lorem Ipsum pasajları da içeren Letraset yapraklarının yayınlanması ile ve yakın zamanda Aldus PageMaker gibi Lorem Ipsum sürümleri içeren masaüstü yayıncılık yazılımları ile popüler olmuştur.

変換すると

位置指定

予想通り、うまくいきます。

これは、「Asciidocter-Diagram」が一旦「PlantUML」コードを画像変換して「Asciidocter」や「Asciidocter-PDF」に引き渡しているために発生する現象と考えられます。
このように内部で変換パーサープログラムがどのような動きをしているかを想像できると手数が増えます。
全てのマニュアルを確認した訳ではないのですが、このテクニックは公式マニュアルでは紹介されていないと思います。それは、それぞれの変換パーサープログラム・マニュアルが独立して解説されているため、若しくは出来て当然だと思われているのでしょうか。
「Asciidocter」のコミュニティも意外と縦割りなのかもしれません。

さて、今回は「PlantUML」の「ダイアグラム」に画像オプションが適用できますよと言う話でした。
いかがだったでしょうか。

…ではまた。

当Noteは下記の「AsciiDoc Language Documentation」の文法に従っています。

AsciiDoc - AsciiDoc Language Documentation