Cacooの図をAPIで取得してAsciiDoc文書に埋め込むasciidoctor-diagram-cacooを作った

  • 8
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

はじめに

AsciiDocの文書内にCacooで作った図を埋め込みたい、しかもいちいちPNGにエクスポートしてローカルに保存しなくてもAPIで画像を取得して埋め込みたい、ということで
asciidoctor-diagramというasciidoctorのエクステンションのエクステンションhnakamur/asciidoctor-diagram-cacooを作成しました。

RubyGems.orgにもasciidoctor-diagram-cacooとして公開済みですので、Gemfileに以下のように書けば利用可能です。

gem "asciidoctor-diagram-cacoo"

サンプル文書

asciidoctor-diagram-cacooを利用したサンプル文書用のプロジェクトhnakamur/asciidoctor-diagram-cacoo-example
も作りました。

日本語入りのPDFのサンプルは
https://hnakamur.github.io/asciidoctor-diagram-cacoo-example/sample-ja.pdf です。

ローカルで試すための手順

予めRubyとJavaとVLゴシックフォントをインストール

asciidoctorはRubyで、asciidoctor-fopubはJavaで書かれていますので、事前にインストールしておいてください。

また、日本語フォントとしてVLゴシックフォントを使用しますので、VL Gothic Font Familyからダウンロードしてインストールしてください。GoogleのNoto Sans Japaneseフォントも使いたいのですが、asciidoctor-fopubがTrueTypeフォントはサポートしていますがOpenTypeフォントはサポートしていないので使えません。

OSXでAnsibleをお使いであれば、hnakamur/macbook_setupを使えばまとめてセットアップすることが出来ます(ただし、他にもいろいろセットアップされます)。

サンプル文書のプロジェクトをgitでローカルに取得

git clone https://github.com/hnakamur/asciidoctor-diagram-cacoo-example
cd asciidoctor-diagram-cacoo-example

APIキーの設定

事前にCacooにログインしてアカウントの設定ページのAPIキータブでAPIキーを発行して、環境変数CACOO_API_KEYに設定しておいてください。

export CACOO_API_KEY=_Your_Cacoo_API_Key_Here_

zimbatm/direnvをお使いの場合は、上記の内容を.envrcというファイルに保存しておいて、以下のコマンドを実行することで、.envrcのファイルが存在するディレクトリにcdしたら自動的に環境変数 CACOO_API_KEY が設定されます。

direnv allow .

direnvは hnakamur/macbook_setupのプレーブックを使えば簡単にセットアップできます。

bundlerでgemをインストール

bundle install --path vendor/bundle --binstubs vendor/bin

PDFファイル作成

以下のコマンドを実行すると.adocファイルに対応して.pdfファイルが生成され、openコマンドによってプレビュー.appで*.pdfファイルを開きます。

bundle exec rake pdf

ファイルウォッチモード

以下のコマンドを実行すると.adocファイルを編集して保存する度に.pdfファイルが生成されプレビュー.appで開きます。

bundle exec rake watch