GitbookでCSVファイルを表示する


はじめに

Gitbook便利ですよね。みなさん使ってますか?

Gitbookで設計書とか書く場合に、外から投げつけられた一覧的なファイル(コード一覧とか、処理対象一覧とか、そういう類のやつ)をそのままGitbook上にインポートして表で表示したいことってありませんか?

ということで、CSVファイル(or CSV形式のテキスト)をインポートして表形式で表示するプラグインを作ってみました。

gitbook-plugin-include-csv

導入方法

他のプラグインと同じです。npmでインストールして book.json に追記するだけです。

$ npm install --save gitbook-plugin-include-csv
book.json
{
    "plugins": ["include-csv"]
}

使用方法

ページ内で、 includeCsv タグを使用してください。
src にファイル名を相対パスで指定した場合は、ファイルを読み込んで表形式(table)で表示します。

page1.md
{% includeCsv src="./train.1.csv" %}{% endincludeCsv %}

タグの中にCSV形式でテキストを記載した場合は、その内容を表形式(table)で表示します。

page2.md
{% includeCsv %}
hoge,fuga
a,0001
b,002
{% endincludeCsv %}

オプションの使い方

useHeader オプションを有効にすると、CSVの1行目を列のヘッダーとして扱います。

page3.md
{% includeCsv useHeader="true" %}
c1,c2,c3
1,1,1
2,2,2
{% endincludeCsv %}

encoding オプションで文字コードに shift_jis を指定すれば、Excel等で作成したShift_JISな日本語CSVファイルも読み込めます。

page4.md
{% includeCsv src="./hoge.csv", encoding="shift_jis", useHeader="true" %}
{% endincludeCsv %}

CSVファイルに列のヘッダーが含まれない場合、exHeaders オプションにカンマ区切りで指定することで表示することができます。
また、 limit オプションで行の数を指定すれば、指定した件数のみ表示します。

page4.md
{% includeCsv 
    src="./train.1.csv", 
    exHeaders="PassengerId,Survived,Pclass,Name,Sex,Age,SibSp,Parch,Ticket,Fare,Cabin,Embarked",
    limit=2 %}
{% endincludeCsv %}

まとめ

  • 資料とかのCSVファイルを簡単にGitbookに表示できるよ。
  • ExcelもCSV変換すれば埋め込めるよ。
  • 行数が多くてmarkdownの表のフォーマットがだるい時のエイリアスとしても使えるよ。
  • 眠いのでREADMEの方の文章はあとで直すよ。