Node.js – Create PDF documents with images

  • by
node-js-pdfkit-pdf-document-creation-sample2

In this post, we will learn how easily we can create PDF documents in our web project using PDFKit in Node.js projects. Often in our web apps we are required to create different PDF docs example invoices, agreements, reports. PDFKit is an open source javascript library for PDF create for Node.js and the browser. We will make use of this library and create a sample PDF file.

Command to install PDFKit:

npm install pdfkit

After installing it your Node project, create two folders with names

  1. files: Inside this folder we will create PDF files.
  2. images: Inside this folder we will paste some images which will be used in our PDF document (copy any two images of your choice with name image1.jpg, image2.jpg)

index.js:

const pdfKit = require('pdfkit');
const fs = require('fs');

function createPdf() {
try {
let fontNormal = 'Helvetica';
let fontBold = 'Helvetica-Bold'
let pdfDoc = new pdfKit();
let fileName = './files/sample.pdf';
let image1 = './images/image1.jpg';
let image2 = './images/image2.jpg';
let sampleText = "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.";
let stream = fs.createWriteStream(fileName);
pdfDoc.pipe(stream);
pdfDoc.text("Node.js PDF document creation with PDFKit library", 5, 5);
pdfDoc.rect(5, 20, 550, 100).stroke("#ff0000");
pdfDoc.text(sampleText, 10, 22);
pdfDoc.font(fontBold).text("This is awesome toolkit", 5, 140);
pdfDoc.stroke("#000").font(fontNormal).text("Name: ThunderMan101", 5, 155, { underline: true });
pdfDoc.addPage();
pdfDoc.text("Node.js PDF document creation with PDFKit library", 5, 5);
pdfDoc.image(image1, 50, 20, { width: 150, height: 150, align: "center" });
pdfDoc.image(image2, 250, 20, { width: 150, height: 150, align: "center" });

pdfDoc.fontSize(20).fillColor('red').text('ParallelCodes', 50, 300, {
link: 'https://parallelcodes.com/',
underline: true
}
);
pdfDoc.end();
console.log("pdf generate successfully");
} catch (error) {
console.log("Error occurred", error);
}
}

createPdf();

You can run the above code by using command

node ./index.js

or if you are using nodemon you can use

nodemon ./index.js

Result: This will create a PDF document like below images:

node.js create pdf document sample 2

node-js-pdfkit-pdf-document-creation-sample2

Explanation of the code:
For using PDFKit library we need to first import it using:

const pdfKit = require('pdfkit');
const fs = require('fs');

fs is fileStream module which is inbuilt in Node.js projects. It gets added while we create our project. The font-family Helvetica & Helvetica-Bold are both supported by PDFKit library.

Syntax for adding text:

pdfDoc.text("Your text here", x-axisPoint, y-axisPoint);
pdfDoc.text("ParallelCodes.com", 5, 5);

Syntax for adding a shape, here we have added rectangle:

pdfDoc.rect(x-axis Point, y-axis Point, width, height).stroke("#HEX Code of the color");
pdfDoc.rect(5, 20, 550, 100).stroke("#ff0000");

Underlining your text use:

pdfDoc.text("Name: ThunderMan101", 5, 155, { underline: true });

Adding new page:

pdfDoc.addPage();

Adding images:

pdfDoc.image('imagePath', x-axis Point, y-axis Point, { width: 150, height: 150, align: "center" });
pdfDoc.image('./images/image1.jpg', 50, 20, { width: 150, height: 150, align: "center" });

Add HTTP links use:

pdfDoc.fontSize(20).fillColor('red').text('ParallelCodes', 50, 300, {
link: 'https://parallelcodes.com/',
underline: true
}
);

For more info on PDFKit and different methods, visit their official documentation: PDFKit.

DOWNLOAD SOURCE CODE

In the next tutorial, we will create a more complex PDF file something like a Invoice of a order using this library. Also I’m doing RnD to create the same using ASP.NET and WPF forms so more post on PDF document creation on its way.


Also see:

Node.js – How to create folder or directory

Node.js – Create, read and write text files.

HTTP module in Node.js

Install Node.js on Windows.