Home » スタッフBlog » 帳票出力とPDF-kit

帳票出力とPDF-kit

category : スタッフBlog 2014.2.3 

技術部の遠藤です。

私事ですが、昨年の12月29日に 第一子となる男の子が生まれました。
社内の方々にはお祝いして頂き誠にありがとうございます。
妻と息子は現在里帰り中なので毎週末帰っているのですが、
1週間立つと赤ちゃんというものは驚くほど変化がありますね。
おむつ替えとお風呂と夜泣きも今はまだ楽しんで子育てしております。
今週末も会えるのが楽しみです。

さて、昨今、javascriptを使った業務システムに携わる事が多くなってまいりました。
業務システムに携わったことがある人なら一度は通るのが帳票出力だと思います。
javaやPHPなどでは既にメジャーなものがいくつかあると思うのですが、
このいろいろと問題が出てくる帳票出力。
node等のサーバーサイドjavascriptが台頭してくると、javascriptでPDF出力もしてみたいところ。
そこで見つけたのがjavascriptからPDFが作成できる「PDFkit」と呼ばれるnodeモジュールです。
ここからはnode.js coffeescript git が既にインストールされているという前提で話しますが、
いざPDFkitでPDFを出力しようと思うと、それは驚くほど簡単です。
手順は以下の通り。

1.PDFkitをgitからクローンします。

git clone https://github.com/devongovett/pdfkit.git

画像1

2.次にクローンしたプロジェクト内にある「demo」ディレクトリ配下でpackage.jsonファイルを作成します。

画像2
vi package.json

画像3
※以下package.jsonの内容

{
“name”: “pdfkit”,
“version”: “0.0.1”,
“main”: “index.js”,
“scripts”: {
“test”: “nodeunit test.js”
},
“dependencies”: {
“pdfkit”: “*”
},
“licenses”: “BSD”
}

3.クローンしたプロジェクト内にある「demo」ディレクトリ配下でnodeモジュールをインストールします。

npm install
画像4

3.クローンしたプロジェクト内にある「demo」ディレクトリで「coffee test.coffee」と打つだけで参考PDFが出来上がります。

画像5

出来上がるファイル名は「out.pdf」
これは以下のように出力されます。

PDF1

あとは、test.coffeeの内部で行っているコーディングをコピペすれば簡単なPDFはすぐに作る事が出来ます。

例:
// 罫線の出力
.lineTo(200, 250)
// ファイル書き出し
doc.write ‘out.pdf’
PDF2

PDFkitの主な特徴としては、簡単にPDFが出力できるだけでなく、
フォントの埋め込み、画像貼り付け等も簡単に実装できる事が挙げられます。

また、HTMLでの記述も出来るようです(こちらはまだ未検証)
HTMLの記述が出来るなら罫線を引いたり、画像の配置なんかも簡単にできますし、CSSを使って装飾を付けることもできると思うので、
罫線をポインタで1つずつ指定していくなんてまどろっこしい作業がなくなるかも知れません。

ただし、現在の最新バージョンではひとつ問題がありました。
それは93種類以上の文字を印字できないという事です。

例えば、以下のようデータを順に表示しようとすると
・One
・Two
・Three
・ⅰⅱⅲⅳⅴⅵⅶⅷⅸⅹⅠⅡⅢⅣⅤⅥⅦⅧⅨⅩ
・¬¦'"㈱№℡∵纊褜鍈銈蓜俉炻昱棈鋹曻彅
・丨仡仼伀伃伹佖侒侊侚侔俍偀倢俿倞偆偰偂傔
・僴僘兊兤冝冾凬刕劜劦勀勛匀匇匤卲厓厲叝﨎
・咜咊咩哿喆坙

PDF3

途中から□しか印字されていない事に気付くと思います。
この問題の具体的な問題と解決策については現在もまだ調査中です。
恐らく表層的にすぐわかる問題ではなかったので(ライブラリの中身まで見始めました)、
どうしても今すぐjavascriptでPDFが出したいんだ!
という方の為に一つ解決策のご提案があります。
それは「PDFkit-cjk」と呼ばれるモジュールです。

これは、
日中韓フォントをサポートする為にjacksctsaiさんによる機能強化が行われたPDFkitです。

これも導入はものすごく簡単です。
先程申し上げた「demo」ディレクトリ内で「npm install pdfkit-cjk」と打ち、
画像6

test.coffeeファイルの「PDFDocument = require ‘pdfkit’」となっているところを「PDFDocument = require ‘pdfkit-cjk’」と書き換えるだけ。
画像7

それ以外は変更せずに先程打った「coffee test.coffee」を再度打ってみましょう。
PDF4

先程□が出ていた箇所も正常に出力されているのが分かると思います。
現在「PDFkit-cjk」についても調査中ではあるのですが、一応出力は出来るようになりました。

ただ、PDFkit-cjkでも一部問題があります。

それはUnicodeに完全には対応していないので、異体字や環境依存文字等は文字化けや印字されないという事です。

※またフォントマップに存在しない文字コードになるとライブラリでエラーになるので、
demo/node_modules/pdfkit-cjk/js/font.js
の「unicode = (‘0000’ + map[code].toString(16)).slice(-4);」のすぐ上に以下のコードを追加してください。
if (!map[code]){
code = 118; // この118は適当な値に変えてください。全体の文字数が少ないと少なくなります。
}

異体字については下記をご参照ください
http://ja.wikipedia.org/wiki/%E5%AD%97%E4%BD%93

例えば、以下の文字列
.list(
[‘異体字は次のような種類に分けられる。(注意:以下には機種依存文字が含まれています)’,
‘同じ構成要素をもつが、その配置が異なるもの’,
‘隣 – 鄰 和 – 咊 飄 – 飃’,
‘峰 – 峯 ? – 岸 群 – 羣’,
‘鵝 – 鵞 鑑 – 鑒 慚 – 慙’,
‘晰 – 晳 稿 – 稾 雜 – 襍’,
‘裏 – 裡 松 – 枩 島 – 嶋 – 嶌’,
‘異なる音符を使ったもの’,
‘棲 – 栖 綫 – 線 麪 – ? 卻 – 却’,
‘筍 – 笋 窯 – 窰 嶋 – 嶹 鐵 – 鉄(?は別字)’,
‘異なる意符を用いたもの’,
‘効 – 效 秘 – 祕 嘆 – 歎 睹 – 覩’,
‘暖 – 煖 器 – 噐 収 – 收 詠 – 咏’,
‘唇 – 脣 罰 – 罸 考 – 攷 恥 – 耻’,
‘埆 – ? 翻 – 飜’,
‘一方が形声で作られ、一方が会意で作られたもの’,
‘涙 – 泪 巌 – 岩 渺 – 淼 拏 – 拿’,
‘逃 – 迯 葉 – 叶 傑 – 杰 ? – 軟   ’,
‘会意や形声の仕方が異なり、字体上の共通項もないもの’,
‘體 – 体 同 – 仝 村 – 邨’,
‘略体・書き癖・運筆の連綿などによって生じたもの(竹冠と草冠、「口」と「ム」、「TRON 3-EC6A.gif」と「TRON 3-EC69.gif」などは相互置換される例が特に多い)’,
‘莚 – 筵 船 – 舩 曾 – 曽’,
‘亰 – 京 鰺 – 鯵 龍 – 竜’,
‘點 – 点 晝 – 昼 畫 – 画’,
‘讀 – 読 戀 – 恋 傳 – 伝 ? – 蚕’
], 100, 50)
これを表示しようとした時

PDF5

このように最後の「蚕」の異体字が表示されませんでした。
Unicodeとフォントマップのマッピングに問題があるのかも知れません。

結論として、簡単にPDF出力を行おうとするならば、「PDFkit-cjk」と使えば良いのですが、
あくまで簡易的な使用に留めるしかないと思われます。

人名やフリーテキスト枠当がある場合には向かないかも知れませんが、
ある種の制限(英字や数字のみ)を容認できる環境であれば十分力を発揮する筈です。
また、「PDFkit-cjk」にてUnicode対応が出来る方法があるのか・・・現在模索中です。

タグ

サイト内検索

Copyright(c) 2014 IT-TERA All Rights Reserved.