nodeJS PDFKitで帳票を作成する方法　

QRコードつきのPDF帳票を出力するニーズがあったので、NodeJS のPDFKitを使って出力する方法を紹介します。

1.インストール方法

npm i pdfkit でインストールできます。

NPM：https://www.npmjs.com/package/pdfkit

公式ページ：http://pdfkit.org/

2.オブジェクトの生成とファイナライズ

        let fs = require('fs');
        const PDFDocument = require('pdfkit');
        // PDFDocument オブジェクト生成
        const doc = new PDFDocument;
        // PDF出力先をカレントフォルダの doc1.pdf に設定
        doc.pipe(fs.createWriteStream('doc1.pdf'));
        // x=10、y=10 の位置に文字列「doc1」を印字
        doc.text('doc1',10,10);
        // ファイナライズ・PDF出力
        doc.end();

出力結果は、doc1.pdfのようになります。

2.文字を印字する

        let fs = require('fs');
        const PDFDocument = require('pdfkit');
        // PDFDocument オブジェクト生成
        const doc = new PDFDocument;
        // PDF出力先をカレントフォルダの doc2.pdf に設定
        doc.pipe(fs.createWriteStream('doc2.pdf'));
        // x=10、y=10 の位置に文字列「doc2」を印字
        doc.font('Ronde-B_square.otf')
            .fontSize(10)
           .text('フォントサイズ10の文字',10,10)
           .fontSize(20)
           .text('フォントサイズ20の文字',10,50)
           .fontSize(30)
           .text('フォントサイズ30の文字',10,90)
           .fontSize(40)
           .text('フォントサイズ40の文字',10,130);
        // ファイナライズ・PDF出力
        doc.end();

• font関数で、フォントファイルを指定します。

フォントは ロンドB https://moji-waku.com/ronde/を使用させていただきました。。

• fontSize 関数でフォントの大きさを指定します。

出力結果は、doc2.pdfのようになります。

3.罫線を引く

        let fs = require('fs');
        const PDFDocument = require('pdfkit');
        // PDFDocument オブジェクト生成
        const doc = new PDFDocument;
        // PDF出力先をカレントフォルダの doc3.pdf に設定
        doc.pipe(fs.createWriteStream('doc3.pdf'));
        // x=10、y=10 の位置に文字列「doc1」を印字
        doc.text('doc3',10,10);
        //x=100, y=100に移動
        doc.moveTo(100,100)
        //x=100, y=100 から x=100, y=200に線を引く
            .lineTo(100,200)
        //x=100, y=200 から x=200, y=200に線を引く
            .lineTo(200,200)
        //x=200, y=200 から x=200, y=100に線を引く
            .lineTo(200,100)
        //x=200, y=100 から x=100, y=100に線を引く
            .lineTo(100,100)
           .stroke();
        // ファイナライズ・PDF出力
        doc.end();

• moveTo関数 で座標移動を行います。

• lineTo関数で線を引きます。

出力結果は、doc3.pdfのようになります。

4.画像を表示する

        let fs = require('fs');
        const PDFDocument = require('pdfkit');
        // PDFDocument オブジェクト生成
        const doc = new PDFDocument;
        // PDF出力先をカレントフォルダの doc4.pdf に設定
        doc.pipe(fs.createWriteStream('doc4.pdf'));
        // x=10、y=10 の位置に文字列「doc4」を印字
        doc.text('doc4',10,10);
        doc.image('./icon.jpg', 100, 100, {
            width: 100
        });
        // ファイナライズ・PDF出力
        doc.end();

出力結果は、doc4.pdfのようになります。

• image関数で画像ファイル、座標位置、幅などのオプションを指定します。

5.次ページを出力する

        let fs = require('fs');
        const PDFDocument = require('pdfkit');
        // PDFDocument オブジェクト生成
        const doc = new PDFDocument;
        // PDF出力先をカレントフォルダの doc5.pdf に設定
        doc.pipe(fs.createWriteStream('doc5.pdf'));
        // x=10、y=10 の位置に文字列「doc1」を印字
        doc.text('doc1',10,10);
        // ページ追加
        doc.addPage();
        doc.text('doc2',10,10);
        doc.font('Ronde-B_square.otf')
            .fontSize(10)
           .text('フォントサイズ10の文字',10,10)
           .fontSize(20)
           .text('フォントサイズ20の文字',10,50)
           .fontSize(30)
           .text('フォントサイズ30の文字',10,90)
           .fontSize(40)
           .text('フォントサイズ40の文字',10,130);
        // ページ追加
        doc.addPage();
        // x=10、y=10 の位置に文字列「doc3」を印字
        doc.text('doc3',10,10);
        //x=100, y=100に移動
        doc.moveTo(100,100)
        //x=100, y=100 から x=100, y=200に線を引く
            .lineTo(100,200)
        //x=100, y=200 から x=200, y=200に線を引く
            .lineTo(200,200)
        //x=200, y=200 から x=200, y=100に線を引く
            .lineTo(200,100)
        //x=200, y=100 から x=100, y=100に線を引く
            .lineTo(100,100)
           .stroke();
        // ファイナライズ・PDF出力
        doc.end();

出力結果は、doc5.pdfのようになります。

• addPage関数でページを追加します。以降の関数は追加後のページに対して処理されます。