やってみる

アウトプットすべく己を導くためのブログ。その試行錯誤すらたれ流す。

AsciiDocでテーブルを書いてみたらMarkdownより冗長だった

Markdownのほうがサクっと書ける。

成果物

GitHubAsciiDoctor.Hello.Table.201705091730

開発環境

AsciiDocでのテーブル

ヘッダなし

f:id:ytyaru:20170509135442p:plain

|================
|abc|def|ghi
|123|456|789
|================

ヘッダあり

f:id:ytyaru:20170509135459p:plain

1行目をヘッダにする。標準CSSだと太字になるらしい。記法は以下のどちらでもOK。

|================
|abc|def|ghi

|123|456|789
|================
[options="header"]
|================
|abc|def|ghi
|123|456|789
|================
[%header]
|================
|abc|def|ghi
|123|456|789
|================

1列目をヘッダにする

f:id:ytyaru:20170509165525p:plain

[cols="h,d,d"]
|================
|abc|def|ghi
|123|456|789
|ABC|DEF|GHI
|アイウ|エオカ|キクケ
|================

画像は1列目が太字になっているのでヘッダになっている。[cols="h,d,d"]とすることで1列目をヘッダのスタイルにできる。2,3列目はデフォルト。

http://asciidoctor.org/docs/user-manual/#cols-format26.2. Column Formatting項の最下部。他のスタイルは以下。

Style Name Value Description
AsciiDoc a ブロックレベル要素(段落、区切られたブロック、ブロックマクロ)が含まれ描画される。
Emphasis e イタリック体になる。
Header h ヘッダになる。<td>でなく<th>になる。
Literal l リテラルブロックとして扱う。
Monospaced m 固定幅フォントで表示する。
None (default style) d 段落<p>として扱う。
Strong s ボールド体になる。
Verse v 詩ブロックとして扱う。

キャプション

f:id:ytyaru:20170509163345p:plain

.表のタイトル
|================
|abc|def|ghi

|123|456|789
|================

列幅を必要最小限にする

f:id:ytyaru:20170509135811p:plain

[options="autowidth"]
|================
|abc|def|ghi
|123|456|789
|================
[%autowidth]
|================
|abc|def|ghi
|123|456|789
|================

autowidthしないと画面サイズ100%に引き伸ばされて見づらい。必須。これデフォルトにして欲しかった。

複数のオプションを併用する

f:id:ytyaru:20170509140145p:plain

[options="header, autowidth"]
|================
|abc|def|ghi長すぎるかもよ
|123|456長いよ|789
|================
[%header%autowidth]
|================
|abc|def|ghi長すぎるかもよ
|123|456長いよ|789
|================

options="*, *"のようにカンマで区切る一般的な記法。%header%autowidthはshellっぽい記法。

Alignment設定

f:id:ytyaru:20170509160828p:plain

[cols="2*", options="header, autowidth"]
|================
^|名前
^|年齢

<|太郎
>|5
<|山田次郎
>|1500
<|シュナイザー三郎
>|530000
|================

Alignmentを設定すると可読性が下がる。書きたくもない。暗号じみてきた。

  • [cols="<,>,^"]
    • 1列目: 左寄せ
    • 2列目: 右寄せ
    • 3列目: 中央寄せ
  • [cols="{左右}.{上下}, {左右}.{上下}, {左右}.{上下}, ..."]
    • [cols="<.<"]は 1列目: 左寄せ + 上寄せ
    • [cols="<.>"]は 1列目: 左寄せ + 下寄せ
    • [cols="<.^"]は 1列目: 左寄せ + 中央寄せ
  • 行定義|の左側に<,>,^を記述する方法もある
    • 1列ごとに改行して定義する
    • ヘッダ行とデータ行の間に改行が必要
    • |item
    • <|item
    • >|item
    • <.^|item

ヘッダ行は中央寄せにしつつ、データ行は左寄せや右寄せにしたい場合が面倒。わりとよくあると思うのだが。

MarkdownとAsciiDoc比較

Markdown

列1|列2|列3
---|---|---
値1|値2|値3
値4|値5|値6

AsciiDoc

[options="header, autowidth"]
|================
|列1|列2|列3
|値1|値2|値3
|値4|値5|値6
|================

参考

感謝。

所感

Markdownと比べてAsciiDocはかなり冗長な記述になってしまう。しかし圧倒的に多機能である。まだ他にもAsciiDocにしかない機能がある。