Markdown の 表(Table,テーブル) を書く拡張機能を作った
Markdown の表を書くときに、セルの結合や表のセルの構成とセルの内容を分けて記述できる Visual Studio Code の拡張機能を作りました。 紹介する拡張機能は MarkdownCat で検索してインストールして下さい。
基本ルール
- 言語名を mdcat.table にしてコードブロック*1を書きます。
- Markdown記法で表を書きます。セルは空白でOKです。
- セルの内容を記述します。 # 行-列 でセルの位置を指定します。(0 から始まる点に注意)
```mdcat.table | | | |:---:|:---:| | | | # 0-0 Header 1 # 0-1 Header 2 # 1-0 Cell 1 # 1-1 Cell 2 ```
ここまでの内容を Vscode のプレビューで見ると下図*2のようになっていると思います。
Markdown記法の併用
もちろん今まで通りセルの内容を表内に記述することができます。 説明が長くなったセルだけ表の外側の記述に変更できる*3のです。
```mdcat.table |動物 |鳴き声| |:--------|:----| |イヌ | | |ネコ | | |ニワトリ | | # 1-1 ワンワン # 2-1 ニャー # 3-1 コケコッコー ```
セルの内容を表の外側で記述できるということで、Markdown 記法では記述できなかった表の入れ子ができます。
```mdcat.table | A | B | |:---:|:---:| | | | # 1-0 * a * b * c # 1-1 |1 |2 | |:---:|:---:| |3 |4 | ```
セルの結合
- セルに > < ^ を記述するとその方向のセルと結合します。
- テキストアライメントは結合先の列の値を採用します。
- 結合したセルの左上の 行-列 を指定して、セルの位置を指定します。
```mdcat.table |left |center|right | |:-----|:----:|-----:| |> |> | | | |< |< | | |< | | |^ |^ | | # 1-0 Cell A # 2-0 Cell B # 3-0 Cell C # 3-2 Cell D # 4-2 Cell E ```
ラベルを付ける
セルの内容は、ラベルとして利用できます。 大きい表やセルの結合を行って 行-列 でセルを指定するのが煩わしくなったときに使いましょう。
```mdcat.table |left |center|right | |:-----|:----:|-----:| | |> | | |> |hello |< | | |< | | # hello Hello World! ```
最後に
mdcat.table で書いた表は、MarkdownCat のマークダウンファイルを結合する機能で html の table タグに変換できます。 印刷や pdf 変換するときは、変換したマークダウンファイル*4を使って下さい。