reveal.jsはHTMLもしくはmark-downで記述した内容をスライドのように見せるためのライブラリです。HTMLなのでWEBにupしてしまえば閲覧可能な状態にはできるのですが、やはりslideshareにもupしたいということもあります。

reveal.jsのREADMEにはブラウザのエクスポート機能を用いたPDF化の方法が紹介されています。しかしこれが結構なフラワーパークで、あれがあれであれな感じです(つまりちゃんと出ない)。そこで今回は、別の方法として紹介されている decktape を使ってPDF化を試してみます。

decktape とは...

HTML5 プレゼンテーションフレームワーク用のPDF生成するためのツールです。
フォントの埋め込み、選択可能なテキスト、ハイパーリンク、SVGグラフィックスオブジェクト、ファイル圧縮などの機能をサポートしています。

インストール

とりあえずgit cloneします。

$ git clone --depth 1 https://github.com/astefanutti/decktape.git
Cloning into 'decktape'...
remote: Counting objects: 31, done.
remote: Compressing objects: 100% (28/28), done.
remote: Total 31 (delta 7), reused 14 (delta 0), pack-reused 0
Unpacking objects: 100% (31/31), done.
Checking connectivity... done.

ディレクトリを移動します。

$ cd decktape

phantomjsを使うのでphantomjsをインストールします。

$ curl -L http://astefanutti.github.io/decktape/downloads/phantomjs-osx-cocoa-x86-64 -o bin/phantomjs
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100   178  100   178    0     0    287      0 --:--:-- --:--:-- --:--:--   962
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
100 16.7M  100 16.7M    0     0  1096k      0  0:00:15  0:00:15 --:--:-- 1844k
$ chmod +x bin/phantomjs
$

PDFを出力

ではPDFを出力します。phantomjsを使ってdecktape.jsを実行します。第一引数にはHTML5 Presentationフレームワーク名を指定します。今回はreveal.jsを使っているのでrevealを指定しました。どれを指定するかはusageで確認できます。第二引数にはスライドがあるURLまたはファイル名を指定します。第三引数は出力するファイル名です。

$ bin/phantomjs decktape.js reveal "http://127.0.0.1:8000/freedom_hill/20150816/#/" test.pdf
Loading page http://127.0.0.1:8000/freedom_hill/20150816/#/ ...
〜省略〜
http://127.0.0.1:8000/bower_components/threejs/examples/js/controls/TrackballControls.js:8 in global code
Loading page finished with status: success
Reveal JS DeckTape plugin activated
Printing slide #/47     (52/48) ...
Printed 52 slides
$

出力できました。52/48と分子が分母より多いのは、スライド内にfragmentなどの指定をしているとHTMLの1ページが2ページになるからです。

出力した結果をslideshareにuploadしておきました。
http://www.slideshare.net/TakesxiSximada/ss-51770003