# Table of Contents - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) - [pdfmake](#pdfmake) --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options [navigation](https://pdfmake.github.io/docs/0.3/#) pdfmake ======= PDF document generation library for server-side and client-side usage in pure JavaScript. Features -------- ##### basics * line-wrapping * text-alignments _(left, right, centered, justified)_ * numbered and bulleted lists * margins * images and vector graphics ##### styling * convenient styling * style inheritance * custom style dictionaries ##### tables and columns * auto/fixed/star-sized/percentage columns widths * col-spans and row-spans * headers _automatically repeated in case of a page-break_ * non-breaking rows * non-breaking sections _keeping headers and rows together_ ##### page headers and footers * static or dynamic content * page numbers * page count ##### other * page dimensions and orientations * background-layer * custom page breaks * font embedding * support for complex, multi-level (nested) structures * table of contents * setting of PDF metadata _(e.g. author, subject)_ * tiling patterns ##### client-side helper methods * download _with the specified filename_ * open _in another tab_ * print _auto-triggering print_ Examples -------- Check out [the playground](http://bpampuch.github.io/pdfmake/playground.html) and [examples](https://github.com/bpampuch/pdfmake/tree/master/examples) . [Migration from 0.1/0.2](https://pdfmake.github.io/docs/0.3/migration-from-0.1/ "Migration from 0.1/0.2") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Migration from 0.1/0.2 ====================== #### Server-side: a different way of invoking the library [See documentation](https://pdfmake.github.io/docs/0.3/getting-started/server-side/) . #### Unified interfaces and all methods return promise Client-side: replace callbacks with promises [see documentation](https://pdfmake.github.io/docs/0.3/getting-started/client-side/methods/) . Server-side: introduce new methods as on the client [see documentation](https://pdfmake.github.io/docs/0.3/getting-started/server-side/methods/) . #### Changed including virtual font storage in client-side Regenerate virtual file system (VFS) is required. #### Changed parameters of pageBreakBefore function Version 0.1 or 0.2: `pageBreakBefore: function(currentNode, followingNodesOnPage, nodesOnNextPage, previousNodesOnPage) { }` Version 0.3: `pageBreakBefore: function(currentNode, nodeContainer) { // nodeContainer.getFollowingNodesOnPage(); // nodeContainer.getNodesOnNextPage(); // nodeContainer.getPreviousNodesOnPage(); }` [See documentation](https://pdfmake.github.io/docs/0.3/document-definition-object/page/#dynamically-control-page-breaks-for-instance-to-avoid-orphan-children) . [pdfmake](https://pdfmake.github.io/docs/0.3/ "pdfmake") [Getting started](https://pdfmake.github.io/docs/0.3/getting-started/ "Getting started") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Getting started =============== Pdfmake is runnable in browser (client-side) and in Node.js (server-side). Usages are described in next chapters. [Migration from 0.1/0.2](https://pdfmake.github.io/docs/0.3/migration-from-0.1/ "Migration from 0.1/0.2") [Client-side](https://pdfmake.github.io/docs/0.3/getting-started/client-side/ "Client-side") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Methods ======= #### Base usage This call will generate a PDF document, methods to get document are described below. `pdfMake.createPdf(docDefinition); pdfMake.createPdf(docDefinition, options);` Parameters: * `docDefinition` - object with document definition, see [chapter](https://pdfmake.github.io/docs/0.3/document-definition-object/) * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.3/options/) #### Download the PDF `pdfMake.createPdf(docDefinition).download(); pdfMake.createPdf(docDefinition).download('file.pdf');` Parameters: * `filename` _(optional)_ - PDF document file name (default ‘file.pdf’) #### Open the PDF in a new window `pdfMake.createPdf(docDefinition).open(); pdfMake.createPdf(docDefinition).open(win);` Parameters: * `win` _(optional)_ - window (when an asynchronous operation) Name can be defined only by using metadata `title` property (see [Document metadata](https://pdfmake.github.io/docs/0.3/document-definition-object/document-medatadata/) ). Asynchronous example: `$scope.generatePdf = function() { // create the window before the callback var win = window.open('', '_blank'); $http.post('/someUrl', data).then(function(response) { // pass the "win" argument pdfMake.createPdf(docDefinition).open(win); }); };` Open in same window: `pdfMake.createPdf(docDefinition).open(window);` #### Print the PDF `pdfMake.createPdf(docDefinition).print(); pdfMake.createPdf(docDefinition).print(win);` Parameters: * `win` _(optional)_ - window (when an asynchronous operation) Asynchronous example: `$scope.generatePdf = function() { // create the window before the callback var win = window.open('', '_blank'); $http.post('/someUrl', data).then(function(response) { // pass the "win" argument pdfMake.createPdf(docDefinition).print(win); }); };` Print in same window: `pdfMake.createPdf(docDefinition).print(window);` #### Get the PDF document as URL data Example of put the PDF document into your own page as URL data: `pdfMake.createPdf(docDefinition).getDataUrl().then((dataUrl) => { const targetElement = document.querySelector('#iframeContainer'); const iframe = document.createElement('iframe'); iframe.src = dataUrl; targetElement.appendChild(iframe); }, err => { console.error(err); });` #### Get the PDF document as base64 data `pdfMake.createPdf(docDefinition).getBase64().then((data) => { alert(data); }, err => { console.error(err); });` #### Get the PDF document as Blob `pdfMake.createPdf(docDefinition).getBlob().then((blob) => { // ... }, err => { console.error(err); });` #### Get the PDF as buffer `pdfMake.createPdf(docDefinition).getBuffer().then((buffer) => { // ... }, err => { console.error(err); });` #### Get the PDF document as stream `pdfMake.createPdf(docDefinition).getStream().then((stream) => { // ... }, err => { console.error(err); });` [Client-side](https://pdfmake.github.io/docs/0.3/getting-started/client-side/ "Client-side") [Supported browsers](https://pdfmake.github.io/docs/0.3/getting-started/client-side/supported-browsers/ "Supported browsers") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Client-side =========== To begin in browser with the default configuration, you should include two files: * **pdfmake.min.js**, * **vfs\_fonts.js** - default font definition (it contains Roboto, you can however [use custom fonts instead](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/) ) ` my first pdfmake example ...` ### Library sources #### CDN * [https://app.unpkg.com/pdfmake](https://app.unpkg.com/pdfmake@0.3/files/build) * `https://unpkg.com/pdfmake@0.3/build/pdfmake.min.js` * `https://unpkg.com/pdfmake@0.3/build/vfs_fonts.js` * [https://www.jsdelivr.com/package/npm/pdfmake](https://www.jsdelivr.com/package/npm/pdfmake?tab=files&path=build) * `https://cdn.jsdelivr.net/npm/pdfmake@0.3/build/pdfmake.min.js` * `https://cdn.jsdelivr.net/npm/pdfmake@0.3/build/vfs_fonts.js` * [https://cdnjs.com/libraries/pdfmake](https://cdnjs.com/libraries/pdfmake) (The service is currently unavailable.) #### npm `npm install pdfmake` Files for client-side is available here: * `require('pdfmake/build/pdfmake.js');` * `require('pdfmake/build/vfs_fonts.js');` Using javascript frameworks: `var pdfMake = require('pdfmake/build/pdfmake.js'); require('pdfmake/build/vfs_fonts.js');` or `var pdfMake = require('pdfmake/build/pdfmake.js'); var pdfFonts = require('pdfmake/build/vfs_fonts.js'); pdfMake.addVirtualFileSystem(pdfFonts);` or `import pdfMake from "pdfmake/build/pdfmake"; import "pdfmake/build/vfs_fonts";` or `import pdfMake from "pdfmake/build/pdfmake"; import pdfFonts from "pdfmake/build/vfs_fonts"; pdfMake.addVirtualFileSystem(pdfFonts);` TypeScript: `import * as pdfMake from "pdfmake/build/pdfmake"; import * as pdfFonts from 'pdfmake/build/vfs_fonts'; (pdfMake).addVirtualFileSystem(pdfFonts);` For Ionic and Angular see [issue](https://github.com/bpampuch/pdfmake/issues/1030) . If a **Cannot read property ‘TYPED\_ARRAY\_SUPPORT’ of undefined** error is thrown, add this to webpack config: `exclude: [ /node_modules/, /pdfmake.js$/ ]` (see [issue](https://github.com/bpampuch/pdfmake/issues/1100#issuecomment-336728521) ) #### Composer You can use asset-packagist.org service, see: [npm-asset/pdfmake](https://asset-packagist.org/package/npm-asset/pdfmake) Example of composer.json: `{ "require": { "npm-asset/pdfmake": "^0.3.0" }, "replace": { "npm-asset/pdfkit": "*", "npm-asset/linebreak": "*", "npm-asset/svg-to-pdfkit": "*", "npm-asset/xmldoc": "*" }, "repositories": [ { "type": "composer", "url": "https://asset-packagist.org" } ] }` #### Repository Copy them directly from the build directory from the repository. Otherwise you can always [build it version 0.3.x from sources](https://github.com/bpampuch/pdfmake#building-from-sources) . [Getting started](https://pdfmake.github.io/docs/0.3/getting-started/ "Getting started") [Methods](https://pdfmake.github.io/docs/0.3/getting-started/client-side/methods/ "Methods") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Supported browsers ================== * Edge * Firefox * Chrome * Chrome (Android) * Opera * Safari (iOS) * Safari (iOS) iPhone Limitations Methods **`open()`** and **`print()`** are supported only in: * Firefox * Chrome * Opera Add-ons used in browsers can affect the functionality of pdfmake (especially for `open()` and `print()`). If pdfmake is not working try disable add-ons in browser. Problematic add-ons AdBlock Fully description is available in [issue](https://github.com/bpampuch/pdfmake/issues/800) . [Methods](https://pdfmake.github.io/docs/0.3/getting-started/client-side/methods/ "Methods") [Examples](https://pdfmake.github.io/docs/0.3/getting-started/client-side/examples/ "Examples") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Supported Node.js versions ========================== * 20 LTS (End-of-life: April 2026) * 22 LTS (End-of-life: April 2027) * 24 LTS (End-of-life: April 2028) [Server-side](https://pdfmake.github.io/docs/0.3/getting-started/server-side/ "Server-side") [Methods](https://pdfmake.github.io/docs/0.3/getting-started/server-side/methods/ "Methods") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Examples ======== Check out [the playground](http://bpampuch.github.io/pdfmake/playground.html) and [examples](https://github.com/bpampuch/pdfmake/tree/master/examples) . [Supported browsers](https://pdfmake.github.io/docs/0.3/getting-started/client-side/supported-browsers/ "Supported browsers") [Server-side](https://pdfmake.github.io/docs/0.3/getting-started/server-side/ "Server-side") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Methods ======= #### Base usage This call will generate a PDF document, methods to get document are described below. `pdfmake.createPdf(docDefinition); pdfmake.createPdf(docDefinition, options);` Parameters: * `docDefinition` - object with document definition, see [chapter](https://pdfmake.github.io/docs/0.3/document-definition-object/) * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.3/options/) #### Write the PDF document as file `pdfmake.createPdf(docDefinition).write(filename).then(() => { // finished }, err => { console.error(err); });` Parameters: * `filename` - PDF document file name * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.3/options/) #### Get the PDF document as URL data `pdfmake.createPdf(docDefinition).getDataUrl().then((dataUrl) => { // ... }, err => { console.error(err); });` #### Get the PDF document as base64 data `pdfmake.createPdf(docDefinition).getBase64().then((data) => { console.log(data); }, err => { console.error(err); });` #### Get the PDF document as buffer `pdfmake.createPdf(docDefinition).getBuffer().then((buffer) => { // ... }, err => { console.error(err); });` #### Get the PDF document as stream `pdfmake.createPdf(docDefinition).getStream().then((stream) => { // ... }, err => { console.error(err); });` [Supported Node.js versions](https://pdfmake.github.io/docs/0.3/getting-started/server-side/supported-nodejs-versions/ "Supported Node.js versions") [Examples](https://pdfmake.github.io/docs/0.3/getting-started/server-side/examples/ "Examples") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Server-side =========== On server-side you can simply install via npm: `npm install pdfmake` #### Example of usage: `// Define font files var fonts = { Roboto: { normal: 'fonts/Roboto-Regular.ttf', bold: 'fonts/Roboto-Medium.ttf', italics: 'fonts/Roboto-Italic.ttf', bolditalics: 'fonts/Roboto-MediumItalic.ttf' } }; var pdfmake = require('pdfmake'); pdfmake.addFonts(fonts); var docDefinition = { // ... }; var options = { // ... } var pdf = pdfmake.createPdf(docDefinition); pdf.write('document.pdf').then(() => { // success event }, err => { // error event console.error(err); });` Parameters for `createPdf`: * `docDefinition` - object with document definition, see [chapter](https://pdfmake.github.io/docs/0.3/document-definition-object/) * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.3/options/) [Examples](https://pdfmake.github.io/docs/0.3/getting-started/client-side/examples/ "Examples") [Supported Node.js versions](https://pdfmake.github.io/docs/0.3/getting-started/server-side/supported-nodejs-versions/ "Supported Node.js versions") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Examples ======== see [examples](https://github.com/bpampuch/pdfmake/tree/master/examples) and [dev-playground server script](https://github.com/bpampuch/pdfmake/blob/master/dev-playground/server.js) [Methods](https://pdfmake.github.io/docs/0.3/getting-started/server-side/methods/ "Methods") [Examples from the community](https://pdfmake.github.io/docs/0.3/getting-started/examples-from-comunity/ "Examples from the community") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Examples from the community =========================== * [vue.js example](https://github.com/bpampuch/pdfmake/issues/2498) * [react-native example](https://github.com/ieschalier/rn-pdfmake) [Examples](https://pdfmake.github.io/docs/0.3/getting-started/server-side/examples/ "Examples") [Fonts](https://pdfmake.github.io/docs/0.3/fonts/ "Fonts") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Custom fonts (client-side) ========================== pdfmake uses the Roboto font by default. This guide explains how to use your own fonts with pdfmake (in client-side code). Two ways are now possible: -------------------------- * [use virtual file system](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/vfs/) * [use font file via URL (https:// or http:// protocol)](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/url/) [Fonts](https://pdfmake.github.io/docs/0.3/fonts/ "Fonts") [via Virtual file system (VFS)](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/vfs/ "via Virtual file system (VFS)") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Icons ===== * make a font at [http://fontello.com/](http://fontello.com/) or something and download it * from font file (for example .ttf) create vfs\_fonts.js file (see how to [use custom fonts](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/#1-create-a-new-vfs-fonts-js-containing-your-font-files) ) * define font in js (just defining normal might be enough): `pdfMake.fonts = { Fontello: { normal: 'fontello.ttf', bold: 'fontello.ttf', italics: 'fontello.ttf', bolditalics: 'fontello.ttf' } }` * add a style for icons: `icon: { font: 'Fontello' }` * make a text paragraph: `{ text: '', style: 'icon' }, //icon wifi` * as the text you copy from the fontello-codes.css from the comments (not the escaped value) * * * If you need an icon within text, you need to nest text objects: `text: [ { text: '', style: 'icon' }, //icon gift " my present" ]` this puts out: “\[gift icon\] my present” [via URL protocol](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/url/ "via URL protocol") [Standard 14 fonts](https://pdfmake.github.io/docs/0.3/fonts/standard-14-fonts/ "Standard 14 fonts") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Fonts ===== Usage of fonts in next chapters. [Examples from the community](https://pdfmake.github.io/docs/0.3/getting-started/examples-from-comunity/ "Examples from the community") [Custom fonts (client-side)](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/ "Custom fonts (client-side)") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Standard 14 fonts ================= PDF contains [standard 14 fonts](http://www.enfocus.com/manuals/ReferenceGuide/PS/18/enUS/en-us/common/pse/concept/c_aa1044513.html) . **Attention!** This fonts supports only **ANSI** code page (only english characters)! Use in pdfmake on server-side ----------------------------- **Example of usage:** `var fonts = { Courier: { normal: 'Courier', bold: 'Courier-Bold', italics: 'Courier-Oblique', bolditalics: 'Courier-BoldOblique' }, Helvetica: { normal: 'Helvetica', bold: 'Helvetica-Bold', italics: 'Helvetica-Oblique', bolditalics: 'Helvetica-BoldOblique' }, Times: { normal: 'Times-Roman', bold: 'Times-Bold', italics: 'Times-Italic', bolditalics: 'Times-BoldItalic' }, Symbol: { normal: 'Symbol' }, ZapfDingbats: { normal: 'ZapfDingbats' } }; var pdfmake = require('pdfmake'); pdfmake.addFonts(fonts); var docDefinition = { content: [ 'First paragraph', 'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines', ], defaultStyle: { font: 'Helvetica' } }; var pdf = pdfmake.createPdf(docDefinition); pdf.write('pdfs/basics.pdf').then(() => { // success event }, err => { console.error(err); });` Use in pdfmake on client-side ----------------------------- Is not supported by default, because this increase size of pdfmake library file about **700 kB**. If you really need it, you can build with standard fonts by `gulp buildWithStandardFonts` command. **Building with standard fonts from sources:** `git clone https://github.com/bpampuch/pdfmake.git cd pdfmake npm install gulp buildWithStandardFonts` **Example of usage:** `pdfMake.fonts = { Courier: { normal: 'Courier', bold: 'Courier-Bold', italics: 'Courier-Oblique', bolditalics: 'Courier-BoldOblique' }, Helvetica: { normal: 'Helvetica', bold: 'Helvetica-Bold', italics: 'Helvetica-Oblique', bolditalics: 'Helvetica-BoldOblique' }, Times: { normal: 'Times-Roman', bold: 'Times-Bold', italics: 'Times-Italic', bolditalics: 'Times-BoldItalic' }, Symbol: { normal: 'Symbol' }, ZapfDingbats: { normal: 'ZapfDingbats' } }; var docDefinition = { content: [ 'First paragraph', 'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines', ], defaultStyle: { font: 'Helvetica' } }; pdfMake.createPdf(docDefinition).download('document.pdf');` [Icons](https://pdfmake.github.io/docs/0.3/fonts/icons/ "Icons") [Document-definition-object](https://pdfmake.github.io/docs/0.3/document-definition-object/ "Document-definition-object") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Document-definition-object ========================== pdfmake follows a declarative approach. It basically means, you’ll never have to calculate positions manually or use commands like: `writeText(text, x, y)`, `moveDown` etc…, as you would with a lot of other libraries. The most fundamental concept to be mastered is the document-definition-object which can be as simple as: `var docDefinition = { content: 'This is an sample PDF printed with pdfMake' };` or become pretty complex (having multi-level tables, images, lists, paragraphs, margins, styles etc…). #### Units All numbers are in points (pt) unit (sometimes labeled as PDF/PostScript points). [Standard 14 fonts](https://pdfmake.github.io/docs/0.3/fonts/standard-14-fonts/ "Standard 14 fonts") [Styling](https://pdfmake.github.io/docs/0.3/document-definition-object/styling/ "Styling") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options via Virtual file system (VFS) ============================= This article is only for **client-side usage** (in browser)! For server-side use **real font files**. TL;DR ----- pdfmake uses a 2nd file: `vfs_fonts.js` for fonts (and other files) you wish to embed into your generated PDFs. When you run command `node build-vfs.js "./examples/fonts"` in the pdfmake package directory a new `build/vfs_fonts.js` file is created containing an **embedded copy** of all files from the local `examples/fonts` subdirectory. Detailed Instructions ===================== To use custom fonts, 3 steps are required: 1. create a new `vfs_fonts.js` file containing your font files 2. assign `pdfMake.addFonts(...)` in your javascript 3. specify the font in your doc-definition 1\. create a new `vfs_fonts.js` containing your font files ---------------------------------------------------------- * Install pdfmake `npm install pdfmake` * Go to package directory `./node_modules/pdfmake/` * Create the `examples/fonts` subdirectory in your pdfmake code directory, if it doesn’t already exist. * Copy your fonts (and other files you wish to embed) into the `examples/fonts` subdirectory. * Run command `node build-vfs.js "./examples/fonts"`. Or run `node build-vfs.js` to show help. * Include your new **build/vfs\_fonts.js** file in your code (in the same way you include `pdfmake.js` or `pdfmake.min.js`). It is recommended to **move** `vfs_fonts.js` file into your own folder structure (should not be in `node_modules` folder). The next time you run `npm install` it might get replaced in `node_modules` with the original content. If your framework caches `node_modules` folder the changes may not take effect. Clear the cache or move `vfs_fonts.js` file outside of `node_modules` folder. The above steps embeds **all** files from `examples/fonts` (into a local key/value variable `pdfMake.vfs`) - not only fonts. Which means you could put images in there, run `node build-vfs.js "./examples/fonts`, and reference them by filename in your doc-definition object. You don’t need to reference the files in `examples/fonts` anymore because all files have been copied to the `vfs_fonts.js`. For building script in other languages see [https://github.com/pdfmake/vfs-builders](https://github.com/pdfmake/vfs-builders) . 2\. assign `pdfMake.addFonts(...)` in your javascript ----------------------------------------------------- In your code, before calling `pdfMake.createPdf(docDefinition)` set `pdfMake.addFonts(...)` as in the example below (notice we don’t specify paths, just filenames): `pdfMake.fonts = { yourFontName: { normal: 'fontFile.ttf', bold: 'fontFile2.ttf', italics: 'fontFile3.ttf', bolditalics: 'fontFile4.ttf' }, anotherFontName: { (...) }, // example of usage fonts in collection PingFangSC: { normal: ['pingfang.ttc', 'PingFangSC-Regular'], bold: ['pingfang.ttc', 'PingFangSC-Semibold'], } }` The keys defined here will be used as font names in your doc-definition styles. Each font-family defines 4 properties: normal, bold, italics and bolditalics referring to appropriate files (the ones you embedded from `examples/fonts/`). You should define all 4 components (even if they all point to the same font file). By default pdfmake uses the following font structure: `pdfMake.addFonts({ Roboto: { normal: 'Roboto-Regular.ttf', bold: 'Roboto-Medium.ttf', italics: 'Roboto-Italic.ttf', bolditalics: 'Roboto-MediumItalic.ttf' } });` 3\. specify the font in your doc-definition ------------------------------------------- pdfMake uses ‘Roboto’ as default font, so in order to use your font, you should specify it in your doc-definition object. The easiest way is to set it globally in the **defaultStyle** `var docDefinition = { content: (...), defaultStyle: { font: 'yourFontName' } }` [Custom fonts (client-side)](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/ "Custom fonts (client-side)") [via URL protocol](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/url/ "via URL protocol") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options via URL protocol ================ To use custom fonts, 2 steps are required: 1. assign `pdfMake.addFonts(...)` your font files accessible via url address in your javascript 2. specify the font in your doc-definition 1\. assign `pdfMake.addFonts(...)` your font files in your javascript --------------------------------------------------------------------- Font files must be accessible via url address (https:// or http:// protocol). In your code, before calling `pdfMake.createPdf(docDefinition)` set `pdfMake.addFonts(...)` as in the example below: `var fonts = { yourFontName: { normal: 'https://example.com/fonts/fontFile.ttf', bold: 'https://example.com/fonts/fontFile2.ttf', italics: 'https://example.com/fonts/fontFile3.ttf', bolditalics: 'https://example.com/fonts/fontFile4.ttf' }, anotherFontName: { (...) }, // download default Roboto font from unpkg.com Roboto: { normal: 'https://unpkg.com/pdfmake@0.3/build/fonts/Roboto/Roboto-Regular.ttf', bold: 'https://unpkg.com/pdfmake@0.3/build/fonts/Roboto/Roboto-Medium.ttf', italics: 'https://unpkg.com/pdfmake@0.3/build/fonts/Roboto/Roboto-Italic.ttf', bolditalics: 'https://unpkg.com/pdfmake@0.3/build/fonts/Roboto/Roboto-MediumItalic.ttf' }, // example of usage fonts in collection PingFangSC: { normal: ['https://example.com/fonts/pingfang.ttc', 'PingFangSC-Regular'], bold: ['https://example.com/fonts/pingfang.ttc', 'PingFangSC-Semibold'], } }; pdfMake.addFonts(fonts);` 2\. specify the font in your doc-definition ------------------------------------------- pdfMake uses ‘Roboto’ as default font, so in order to use your font, you should specify it in your doc-definition object. The easiest way is to set it globally in the **defaultStyle** `var docDefinition = { content: (...), defaultStyle: { font: 'yourFontName' } }` [via Virtual file system (VFS)](https://pdfmake.github.io/docs/0.3/fonts/custom-fonts-client-side/vfs/ "via Virtual file system (VFS)") [Icons](https://pdfmake.github.io/docs/0.3/fonts/icons/ "Icons") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Options ======= Advanced options for creating document used in [client-side methods](https://pdfmake.github.io/docs/0.3/getting-started/client-side/methods/) or [server-side method](https://pdfmake.github.io/docs/0.3/getting-started/server-side/) . Options: * `fontLayoutCache` - option to disable font layout cache (_default_: `true` - cache enabled) * `bufferPages` - allows you to control when pages are flushed to the output file (see [pdfkit documentation](http://pdfkit.org/docs/getting_started.html) ) (_default_: `false` - buffer disabled) [PDF/A](https://pdfmake.github.io/docs/0.3/document-definition-object/pdfa/ "PDF/A") [Migration from 0.1/0.2](https://pdfmake.github.io/docs/0.3/migration-from-0.1/ "Migration from 0.1/0.2") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Columns ======= By default paragraphs are rendered as a vertical stack of elements (one below another). It is possible however to divide available space into columns. `var docDefinition = { content: [ 'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', { columns: [ { // auto-sized columns have their widths based on their content width: 'auto', text: 'First column' }, { // star-sized columns fill the remaining space // if there's more than one star-column, available width is divided equally width: '*', text: 'Second column' }, { // fixed width width: 100, text: 'Third column' }, { // % width width: '20%', text: 'Fourth column' } ], // optional space between columns columnGap: 10 }, 'This paragraph goes below all columns and has full width' ] };` Column content is not limited to a simple text. It can actually contain any valid pdfmake element. Make sure to look at the COLUMNS example in [playground](http://pdfmake.org/playground.html) . ##### Properties * `columnGap: number` specify gap (space) between columns [Styling](https://pdfmake.github.io/docs/0.3/document-definition-object/styling/ "Styling") [Tables](https://pdfmake.github.io/docs/0.3/document-definition-object/tables/ "Tables") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Lists ===== pdfmake supports both numbered and bulleted lists: `var docDefinition = { content: [ 'Bulleted list example:', { // to treat a paragraph as a bulleted list, set an array of items under the ul key ul: [ 'Item 1', 'Item 2', 'Item 3', { text: 'Item 4', bold: true }, ] }, 'Numbered list example:', { // for numbered lists set the ol key ol: [ 'Item 1', 'Item 2', 'Item 3' ] }, 'Colored unordered list:', { color: 'blue', ul: [ 'item 1', 'item 2', 'item 3' ] }, 'Colored unordered list with own marker color:', { color: 'blue', markerColor: 'red', ul: [ 'item 1', 'item 2', { text: 'item 3 with custom marker color', markerColor: 'lime' } // Minimal pdfmake version: 0.3.2 ] }, 'Colored ordered list', { color: 'blue', ol: [ 'item 1', 'item 2', 'item 3' ] }, 'Colored ordered list with own marker color:', { color: 'blue', markerColor: 'red', ol: [ 'item 1', 'item 2', { text: 'item 3 with custom marker color', markerColor: 'lime' } // Minimal pdfmake version: 0.3.2 ] }, ] };` [Tables](https://pdfmake.github.io/docs/0.3/document-definition-object/tables/ "Tables") [Headers and footers](https://pdfmake.github.io/docs/0.3/document-definition-object/headers-footers/ "Headers and footers") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Styling ======= pdfmake makes it possible to style any paragraph or its part: `var docDefinition = { content: [ // if you don't need styles, you can use a simple string to define a paragraph 'This is a standard paragraph, using default style', // using a { text: '...' } object lets you set styling properties { text: 'This paragraph will have a bigger font', fontSize: 15 }, // if you set the value of text to an array instead of a string, you'll be able // to style any part individually { text: [ 'This paragraph is defined as an array of elements to make it possible to ', { text: 'restyle part of it and make it bigger ', fontSize: 15 }, 'than the rest.' ] } ] };` #### Style dictionaries It’s also possible to define a dictionary of reusable styles: `var docDefinition = { content: [ { text: 'This is a header', style: 'header' }, 'No styling here, this is a standard paragraph', { text: 'Another text', style: 'anotherStyle' }, { text: 'Multiple styles applied', style: [ 'header', 'anotherStyle' ] } ], styles: { header: { fontSize: 22, bold: true }, anotherStyle: { italics: true, alignment: 'right' }, subheader: { fontSize: 15, extends: 'header' // or array of strings } } };` Property `extends` in style inherited/extends styles. _(Minimal pdfmake version: 0.3.3)_ To have a deeper understanding of styling in pdfmake, style inheritance and local-style-overrides check STYLES1, STYLES2 and STYLES3 examples in [playground](http://pdfmake.org/playground.html) . #### Default style And it is also possible to define a default style: `var docDefinition = { content: [ 'Text styled by default style' ], defaultStyle: { fontSize: 15, bold: true } };` #### Style properties * `font: string`: name of the font * `fontSize: number`: size of the font in pt * `fontFeatures: string[]`: array of advanced typographic features supported in TTF fonts (supported features depend on font file) * `lineHeight: number`: the line height (default: 1) * `bold: boolean`: whether to use bold text (default: false) * `italics: boolean`: whether to use italic text (default: false) * `alignment: string`: (‘left’ or ‘center’ or ‘right’ or ‘justify’) the alignment of the text * `characterSpacing: number`: size of the letter spacing in pt * `wordBreak: string`: controls how text is wrapped when it exceeds the available width (supported values: `'normal'` (default), `'break-all'`) * `color: string`: the color of the text (color name e.g., ‘blue’ or hexadecimal color e.g., ‘#ff5500’) * `background: string` the background color of the text * `style: string | array`: defined style of item * `markerColor: string`: the color of the bullets in a buletted list * `decoration: string | string[]`: the text decoration to apply (‘underline’ or ‘lineThrough’ or ‘overline’) * `decorationStyle: string`: the style of the text decoration (‘dashed’ or ‘dotted’ or ‘double’ or ‘wavy’) * `decorationColor: string`: the color of the text decoration, see color * `decorationThickness: integer`: for `text` to set width of the decoration line _(Minimal pdfmake version: 0.3.3)_ [Document-definition-object](https://pdfmake.github.io/docs/0.3/document-definition-object/ "Document-definition-object") [Columns](https://pdfmake.github.io/docs/0.3/document-definition-object/columns/ "Columns") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Tables ====== Conceptually tables are similar to columns. They can however have headers, borders and cells spanning over multiple columns/rows. The table node expects a valid table value. If the value is invalid or empty, an error is thrown. This includes the table.body property as well. `var docDefinition = { content: [ { layout: 'lightHorizontalLines', // optional table: { // headers are automatically repeated if the table spans over multiple pages // you can declare how many rows should be treated as headers headerRows: 1, widths: [ '*', 'auto', 100, '*' ], body: [ [ 'First', 'Second', 'Third', 'The last one' ], [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ], [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ] ] } } ] };` ##### Table-cell properties * `fillColor: string`: the background color of a table cell * `fillOpacity: string`: the background opacity of a table cell ##### Table layouts Can be used `layout` property for set table layout. Available table layouts: * `noBorders` * `headerLineOnly` * `lightHorizontalLines` ##### Own table layouts Own table layouts must be defined before calling `pdfMake.createPdf(docDefinition)`. `// define table layouts var tableLayouts = { exampleLayout: { hLineWidth: function (i, node) { if (i === 0 || i === node.table.body.length) { return 0; } return (i === node.table.headerRows) ? 2 : 1; }, vLineWidth: function (i) { return 0; }, hLineColor: function (i) { return i === 1 ? 'black' : '#aaa'; }, paddingLeft: function (i) { return i === 0 ? 0 : 8; }, paddingRight: function (i, node) { return (i === node.table.widths.length - 1) ? 0 : 8; } } }; // add table layouts pdfMake.addTableLayouts(tableLayouts); // download the PDF pdfMake.createPdf(docDefinition).download();` * On the server side: `var pdfmake = require('pdfmake'); pdfmake.addFonts(fonts); // Declaring your layout var myTableLayouts = { exampleLayout: { /* Your layout here. */ } }; // Building the PDF var pdf = pdfmake.createPdf(docDefinition); // Writing it to disk pdf.write('document.pdf').then(() => { // success event }, err => { // error event console.error(err); });` ##### colSpan and rowSpan If you use colSpan or rowSpan, don’t forget to use an empty cell for the next columns or rows. See example below. `var dd = { content: [ { table: { body: [ [{text: 'Header with Colspan = 2', style: 'tableHeader', colSpan: 2, alignment: 'center'}, '', {text: 'Header 3', style: 'tableHeader', alignment: 'center'}], [{text: 'Header 1', style: 'tableHeader', alignment: 'center'}, {text: 'Header 2', style: 'tableHeader', alignment: 'center'}, {text: 'Header 3', style: 'tableHeader', alignment: 'center'}], ['Sample value 1', 'Sample value 2', 'Sample value 3'], [{rowSpan: 3, text: 'rowSpan set to 3\nLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor'}, 'Sample value 2', 'Sample value 3'], ['', 'Sample value 2', 'Sample value 3'], ['Sample value 1', 'Sample value 2', 'Sample value 3'], ['Sample value 1', {colSpan: 2, rowSpan: 2, text: 'Both:\nrowSpan and colSpan\ncan be defined at the same time'}, ''], ['Sample value 1', '', ''], ] } } ] }` All concepts related to tables are covered by TABLES example in [playground](http://pdfmake.org/playground.html) . [Columns](https://pdfmake.github.io/docs/0.3/document-definition-object/columns/ "Columns") [Lists](https://pdfmake.github.io/docs/0.3/document-definition-object/lists/ "Lists") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Margins ======= Any element in pdfMake can have a margin: `// margin: [left, top, right, bottom] { text: 'sample', margin: [ 5, 2, 10, 20 ] }, // margin: [horizontal, vertical] { text: 'another text', margin: [5, 2] }, // margin: equalLeftTopRightBottom { text: 'last one', margin: 5 } // single-side margins { text: 'sample', marginLeft: 5, marginTop: 2, marginRight: 10, marginBottom: 2 },` [Background-layer](https://pdfmake.github.io/docs/0.3/document-definition-object/background-layer/ "Background-layer") [Stack of paragraphs](https://pdfmake.github.io/docs/0.3/document-definition-object/stack/ "Stack of paragraphs") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Headers and footers =================== Page headers and footers in pdfmake can be: _static_ or _dynamic_. They use the same syntax: `var docDefinition = { header: 'simple text', footer: { columns: [ 'Left part', { text: 'Right part', alignment: 'right' } ] }, content: (...) };` For dynamically generated content (including page numbers, page count and page size) you can pass a function to the header or footer: `var docDefinition = { footer: function(currentPage, pageCount) { return currentPage.toString() + ' of ' + pageCount; }, header: function(currentPage, pageCount, pageSize) { // you can apply any logic and return any valid pdfmake element return [ { text: 'simple text', alignment: (currentPage % 2) ? 'left' : 'right' }, { canvas: [ { type: 'rect', x: 170, y: 32, w: pageSize.width - 170, h: 40 } ] } ] }, (...) };` [Lists](https://pdfmake.github.io/docs/0.3/document-definition-object/lists/ "Lists") [Background-layer](https://pdfmake.github.io/docs/0.3/document-definition-object/background-layer/ "Background-layer") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Background-layer ================ The background-layer will be added on every page. `var docDefinition = { background: 'simple text', content: (...) };` It may contain any other object as well (images, tables, …) or be dynamically generated: ``var docDefinition = { background: function(currentPage, pageSize) { return `page ${currentPage} with size ${pageSize.width} x ${pageSize.height}` }, content: (...) };`` [Headers and footers](https://pdfmake.github.io/docs/0.3/document-definition-object/headers-footers/ "Headers and footers") [Margins](https://pdfmake.github.io/docs/0.3/document-definition-object/margins/ "Margins") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Stack of paragraphs =================== You could have figured out by now (from the examples), that if you set the `content` key to an array, the document becomes a stack of paragraphs. You’ll quite often reuse this structure in a nested element, like in the following example: `var docDefinition = { content: [ 'paragraph 1', 'paragraph 2', { columns: [ 'first column is a simple text', [ // second column consists of paragraphs 'paragraph A', 'paragraph B', 'these paragraphs will be rendered one below another inside the column' ] ] } ] };` The problem with an array is that you cannot add styling properties to it (to change fontSize for example). The good news is - array is just a shortcut in pdfMake for { stack: \[\] }, so if you want to restyle the whole stack, you can do it using the expanded definition: `var docDefinition = { content: [ 'paragraph 1', 'paragraph 2', { columns: [ 'first column is a simple text', { stack: [ // second column consists of paragraphs 'paragraph A', 'paragraph B', 'these paragraphs will be rendered one below another inside the column' ], fontSize: 15 } ] } ] };` [Margins](https://pdfmake.github.io/docs/0.3/document-definition-object/margins/ "Margins") [Document sections](https://pdfmake.github.io/docs/0.3/document-definition-object/sections/ "Document sections") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Document sections ================= Document sections allow you to divide a document into multiple parts, each with its own page settings. Each section support: * custom page size and orientation * custom page margin * custom header/footer * custom watermark * custom background Definition including all properties: `var docDefinition = { content: [ { header: function (currentPage, pageCount) { return currentPage.toString() + ' of ' + pageCount; }, footer: function (currentPage, pageCount) { return currentPage.toString() + ' of ' + pageCount; }, background: function () { return {text: 'background', alignment: 'right'}; }, watermark: 'watermark', pageSize: 'A4', pageOrientation: 'landscape', pageMargins: 5, section: [ 'Text in section.' ] } ] }` In the next section, properties can be inherited from the previous section: `var docDefinition = { content: [ { header: 'inherit', footer: 'inherit', background: 'inherit', watermark: 'inherit', pageSize: 'inherit', pageOrientation: 'inherit', pageMargins: 'inherit', section: [ 'Text in section.' ] } ] }` Full example is available in [examples/section.js](https://github.com/bpampuch/pdfmake/blob/master/examples/sections.js) . [Stack of paragraphs](https://pdfmake.github.io/docs/0.3/document-definition-object/stack/ "Stack of paragraphs") [Images](https://pdfmake.github.io/docs/0.3/document-definition-object/images/ "Images") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options SVGs ==== SVGs are much like [images](https://pdfmake.github.io/docs/0.3/document-definition-object/images/) except it is not currently possible to refer to SVGs by file or re-use from a dictionary. The SVG node expects a valid SVG value. If the value is invalid or empty, an error is thrown. Library [SVG-to-PDFKit](https://github.com/alafr/SVG-to-PDFKit) is used to transformation from SVG to PDF document. Node `svg` value can be string or `SVGElement` object (is available only in browser). Support of `SVGElement` object required version **0.3.1** or later `var docDefinition = { content: [ { // If no width/height/fit is used, then dimensions from the svg element is used. svg: '...' }, { // if you specify width, svg will scale proportionally svg: '...', width: 150 }, { // if you specify height, svg will scale proportionally // Minimal pdfmake version: 0.3.2 svg: '...', height: 100 }, { // if you specify both width and height - svg will be stretched svg: '...', width: 600, height: 400 }, { // you can also fit the svg inside a rectangle svg: '...', fit: [150, 100] }, { // if no width/height is specified in SVG element, you must set width and height for node svg: '...', width: 300, height: 200 }, ] };` [Images](https://pdfmake.github.io/docs/0.3/document-definition-object/images/ "Images") [Links](https://pdfmake.github.io/docs/0.3/document-definition-object/links/ "Links") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Images ====== This is simple. Just use the `{ image: '...' }` node type. JPEG and PNG formats are supported. The image node expects a valid image value. If the value is invalid or empty, an error is thrown. `var docDefinition = { content: [ { // you'll most often use dataURI images on the browser side // if no width/height/fit is provided, the original size will be used image: 'data:image/jpeg;base64,...encodedContent...' }, { // if you specify width, image will scale proportionally image: 'data:image/jpeg;base64,...encodedContent...', width: 150 }, { // if you specify height, image will scale proportionally // Minimal pdfmake version: 0.3.2 image: 'data:image/jpeg;base64,...encodedContent...', height: 100 }, { // if you specify both width and height - image will be stretched image: 'data:image/jpeg;base64,...encodedContent...', width: 150, height: 150 }, { // you can also fit the image inside a rectangle image: 'data:image/jpeg;base64,...encodedContent...', fit: [100, 100] }, { // You can also cover the image inside a rectangle image: 'data:image/jpeg;base64,...encodedContent...', cover: { width: 100, height: 100, valign: "bottom", align: "right" }, }, { // if you reuse the same image in multiple nodes, // you should put it to to images dictionary and reference it by name image: 'mySuperImage' }, { // under NodeJS (or in case you use virtual file system provided by pdfmake) // you can also pass file names here image: 'myImageDictionary/image1.jpg' }, { // is supported loading images via url from reference by name in images image: 'snow' }, { image: 'strawberries' }, ], images: { mySuperImage: 'data:image/jpeg;base64,...content...', // is supported loading images via url (https or http protocol) snow: 'https://picsum.photos/seed/picsum/200/300', // is supported loading images via url with custom headers strawberries: { url: 'https://picsum.photos/id/1080/367/267', headers: { myheader: '123', myotherheader: 'abc', } } } };` [Document sections](https://pdfmake.github.io/docs/0.3/document-definition-object/sections/ "Document sections") [SVGs](https://pdfmake.github.io/docs/0.3/document-definition-object/svgs/ "SVGs") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options QR code ======= `var docDefinition = { content: [ // basic usage { qr: 'text in QR' }, // colored QR { qr: 'text in QR', foreground: 'red', background: 'yellow' }, // resized QR { qr: 'text in QR', fit: '500' }, ] }` Properties: * `qr`: `string` - text in QR code * `foreground`: `string` (optional, default black) - foreground color * `background`: `string` (optional, default white) - background color * `fit`: `integer` (optional) - fit the output QR image * `version`: `integer` (optional) - QR version range from 1 to 40 (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Storage) * `eccLevel`: `string` (optional, default L) - error correction capability (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Error_correction) ), possible values: * _L_ - Level L (Low), approx 7% of codewords can be restored * _M_ - Level M (Medium), approx 15% of codewords can be restored * _Q_ - Level Q (Quartile), approx 25% of codewords can be restored * _H_ - Level H (High), approx 30% of codewords can be restored * `mode`: `string` (optional) - encoding mode, possible values: _numeric_, _alphanumeric, octet_ (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Storage) ) * `mask`: `integer` (optional) - mask pattern, range from 0 to 7 (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Encoding) ) [Links](https://pdfmake.github.io/docs/0.3/document-definition-object/links/ "Links") [Table of contents](https://pdfmake.github.io/docs/0.3/document-definition-object/toc/ "Table of contents") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Links ===== To add external or internal links, use the following syntax: `{ text: 'google', link: 'http://google.com' } { text: 'Go to page 2', linkToPage: 2 } { text: 'Go to Header', linkToDestination: 'header' }, { text: 'Header content', id: 'header' },` Or link to local computer file: `var dd = { content: [ { text: 'link', link: 'file:///c:/testFile.txt' } ] };` ##### Properties * `link` (`string`) - URL to external site * `linkToPage` (`number`) - link to page number * `linkToDestination` (`string`) - link to document destination [SVGs](https://pdfmake.github.io/docs/0.3/document-definition-object/svgs/ "SVGs") [QR code](https://pdfmake.github.io/docs/0.3/document-definition-object/qr/ "QR code") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Table of contents ================= The simplest example of a table of contents: `var docDefinition = { content: [ { toc: { title: {text: 'INDEX', style: 'header'} //textMargin: [0, 0, 0, 0], //textStyle: {italics: true}, numberStyle: { bold: true }, } }, { text: 'This is a header', style: 'header', tocItem: true } ] }` If `id` is used in toc, the tocItem can target that id: `var docDefinition = { content: [ { toc: { id: 'mainToc', title: {text: 'INDEX', style: 'header'} } }, { text: 'This is a header', style: 'header', tocItem: 'mainToc' } ] }` If multiple Table of Contents are used, tocItem can be used to place the text in the correct toc: `var docDefinition = { content: [ { toc: { id: 'mainToc', title: {text: 'INDEX', style: 'header'} }, toc: { id: 'subToc', title: {text: 'SUB INDEX', style: 'header'} } }, { text: 'This is a header', style: 'header', tocItem: ['mainToc', 'subToc'] } ] }` #### ToC properties * `id: string`: (optional) only usable if you use multiple ToC lists to identify * `title: string | text node`: (optional) title of ToC, string or text node * `hideEmpty: boolean`: (optional) (default `false`) hide ToC if is empty _(Minimal pdfmake version: 0.3.3)_ * `textStyle`: (optional) * `numberStyle`: (optional) * `textMargin`: (optional) * `sortBy: string`: (optional) `'page'` (default) or `'title'` _(Minimal pdfmake version: 0.3.3)_ * `sortLocale: string`: (optional) default browser or nodejs language is used _(Minimal pdfmake version: 0.3.3)_ #### Node properties * `tocItem: boolean | string`: * `textStyle`: (optional) * `numberStyle`: (optional) * `textMargin`: (optional) [QR code](https://pdfmake.github.io/docs/0.3/document-definition-object/qr/ "QR code") [Watermark](https://pdfmake.github.io/docs/0.3/document-definition-object/watermark/ "Watermark") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Watermark ========= #### Properties * `text` - watermark text * `color` - color of text * `opacity` opacity of text * `bold` - bold style of text * `italics` - italics style of text * `fontSize` - own font size of text (ideal size is calculated automatically) * `angle` - angle of text rotation #### Examples Example of simple basic usage: `var docDefinition = { watermark: 'test watermark', content: [ '...' ] };` Example of font style: `var docDefinition = { watermark: { text: 'test watermark', color: 'blue', opacity: 0.3, bold: true, italics: false }, content: [ '...' ] };` Example of own font size: `var docDefinition = { watermark: { text: 'test watermark', fontSize: 20 }, content: [ '...' ] };` Example of watermark rotation angle: `var docDefinition = { watermark: { text: 'test watermark', angle: 70 }, content: [ '...' ] };` [Table of contents](https://pdfmake.github.io/docs/0.3/document-definition-object/toc/ "Table of contents") [Page dimensions, orientation and margins](https://pdfmake.github.io/docs/0.3/document-definition-object/page/ "Page dimensions, orientation and margins") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Page dimensions, orientation and margins ======================================== `var docDefinition = { // a string or { width: number, height: number } pageSize: 'A5', // by default we use portrait, you can change it to landscape if you wish pageOrientation: 'landscape', // [left, top, right, bottom] or [horizontal, vertical] or just a number for equal margins pageMargins: [ 40, 60, 40, 60 ], };` If you set `pageSize` to a string, you can use one of the following values: * `'4A0'`, `'2A0'`, `'A0'`, `'A1'`, `'A2'`, `'A3'`, `'A4'`, `'A5'`, `'A6'`, `'A7'`, `'A8'`, `'A9'`, `'A10'`, * `'B0'`, `'B1'`, `'B2'`, `'B3'`, `'B4'`, `'B5'`, `'B6'`, `'B7'`, `'B8'`, `'B9'`, `'B10'`, * `'C0'`, `'C1'`, `'C2'`, `'C3'`, `'C4'`, `'C5'`, `'C6'`, `'C7'`, `'C8'`, `'C9'`, `'C10'`, * `'RA0'`, `'RA1'`, `'RA2'`, `'RA3'`, `'RA4'`, * `'SRA0'`, `'SRA1'`, `'SRA2'`, `'SRA3'`, `'SRA4'`, * `'EXECUTIVE'`, `'FOLIO'`, `'LEGAL'`, `'LETTER'`, `'TABLOID'` To change page orientation within a document, add a page break with the new page orientation. `{ pageOrientation: 'portrait', content: [ {text: 'Text on Portrait'}, {text: 'Text on Landscape', pageOrientation: 'landscape', pageBreak: 'before'}, {text: 'Text on Landscape 2', pageOrientation: 'portrait', pageBreak: 'after'}, {text: 'Text on Portrait 2'}, ] }` Automatic page height: `var dd = { pageSize: { width: 595.28, height: 'auto' }, content: [ // ... ] }` #### Dynamically control page breaks, for instance to avoid orphan children A `pageBreakBefore` function can be specified, which can determine if a page break should be inserted before a node. To implement a ‘no orphan child’ rule, use a definition like this: `var dd = { content: [ {text: '1 Headline', headlineLevel: 1}, 'Some long text of variable length ...', {text: '2 Headline', headlineLevel: 1}, 'Some long text of variable length ...', {text: '3 Headline', headlineLevel: 1}, 'Some long text of variable length ...', ], pageBreakBefore: function(currentNode, nodeContainer) { // nodeContainer.getFollowingNodesOnPage(); // nodeContainer.getNodesOnNextPage(); // nodeContainer.getPreviousNodesOnPage(); return currentNode.headlineLevel === 1 && nodeContainer.getFollowingNodesOnPage().length === 0; } }` If `pageBreakBefore` returns true, a page break will be added before the `currentNode`. Current node has the following information attached: `{ id: '', headlineLevel: '', text: '', ul: '', ol: '', table: '', image: '', qr: '', canvas: '', columns: '', style: '', pageOrientation '', pageNumbers: [2, 3], // The pages this element is visible on (e.g. multi-line text could be on more than one page) pages: 6, // the total number of pages of this document stack: false, // if this is an element which encapsulates multiple sub-objects startPosition: { pageNumber: 2, // the page this node starts on pageOrientation: 'landscape', // the orientation of this page left: 60, // the left position right: 60, // the right position verticalRatio: 0.2, // the ratio of space used vertically in this document (excluding margins) horizontalRatio: 0.0 // the ratio of space used horizontally in this document (excluding margins) } }` [Watermark](https://pdfmake.github.io/docs/0.3/document-definition-object/watermark/ "Watermark") [Document Metadata](https://pdfmake.github.io/docs/0.3/document-definition-object/document-medatadata/ "Document Metadata") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Document Metadata ================= PDF documents can have various metadata associated with them, such as the title, or author of the document. You can add that information by adding it to the document definition `var docDefinition = { info: { title: 'awesome Document', author: 'john doe', subject: 'subject of document', keywords: 'keywords for document', }, content: 'This is an sample PDF printed with pdfMake' }` Standard properties: * `title` - the title of the document * `author` - the name of the author * `subject` - the subject of the document * `keywords` - keywords associated with the document * `creator` - the creator of the document (default is ‘pdfmake’) * `producer` - the producer of the document (default is ‘pdfmake’) * `creationDate` - the date the document was created (added automatically by pdfmake) * `modDate` - the date the document was last modified * `trapped` - the trapped flag in a PDF document indicates whether the document has been “trapped”, i.e. corrected for slight color misregistrations Custom properties: You can add custom properties. Key of property not contain spaces. #### Document language PDF document can have custom language set via `language` property. Example: `var docDefinition = { language: 'cs-CZ' content: 'Jednoduchý PDF dokument vytvoření pomocí pdfmake' }` [Page dimensions, orientation and margins](https://pdfmake.github.io/docs/0.3/document-definition-object/page/ "Page dimensions, orientation and margins") [Patterns](https://pdfmake.github.io/docs/0.3/document-definition-object/patterns/ "Patterns") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Compression =========== Compression of PDF is enabled by default, use `compress: false` for disable: `var docDefinition = { compress: false, content: (...) };` [Patterns](https://pdfmake.github.io/docs/0.3/document-definition-object/patterns/ "Patterns") [Encryption and access privileges](https://pdfmake.github.io/docs/0.3/document-definition-object/security/ "Encryption and access privileges") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Encryption and access privileges ================================ `var docDefinition = { userPassword: '123', ownerPassword: '123456', permissions: { printing: 'highResolution', //'lowResolution' modifying: false, copying: false, annotating: true, fillingForms: true, contentAccessibility: true, documentAssembly: true }, content: [ '...' ] };` PDF document allow you to encrypt the PDF file and require a password when opening the file, and/or set permissions of what users can do with the PDF file. To enable encryption set user password in `userPassword` (string value). The PDF file will be encrypted when a user password is provided, and users will be prompted to enter the password to decrypt the file when opening it. To set access privileges for the PDF file, you need to provide an owner password in `ownerPassword` (string value) and object `permissions` with permissions. By default, all operations are disallowed. You need to explicitly allow certain operations. Following settings are allowed in `permissions` object: * `printing` - whether printing is allowed. Specify `"lowResolution"` to allow degraded printing, or `"highResolution"` to allow printing with high resolution * `modifying` - whether modifying the file is allowed. Specify `true` to allow modifying document content * `copying` - whether copying text or graphics is allowed. Specify `true` to allow copying * `annotating` - whether annotating, form filling is allowed. Specify `true` to allow annotating and form filling * `fillingForms` - whether form filling and signing is allowed. Specify `true` to allow filling in form fields and signing * `contentAccessibility` - whether copying text for accessibility is allowed. Specify `true` to allow copying for accessibility * `documentAssembly` - whether assembling document is allowed. Specify `true` to allow document assembly You can specify either user password, owner password or both passwords. Behavior differs according to passwords you provides: * When only user password is provided, users with user password are able to decrypt the file and have full access to the document. * When only owner password is provided, users are able to decrypt and open the document without providing any password, but the access is limited to those operations explicitly permitted. Users with owner password have full access to the document. * When both passwords are provided, users with user password are able to decrypt the file but only have limited access to the file according to permission settings. Users with owner password have full access to the document. Note that PDF file itself cannot enforce access privileges. When file is decrypted, PDF viewer applications have full access to the file content, and it is up to viewer applications to respect permission settings. To choose encryption method, you need to specify PDF version by `version`. The best possible encryption method for PDF version is used. PDF version is used only for encryption method, all other PDF elements are in version 1.3. Available versions: * `1.3` - PDF version 1.3 (default), 40-bit RC4 is used * `1.4` - PDF version 1.4, 128-bit RC4 is used * `1.5` - PDF version 1.5, 128-bit RC4 is used * `1.6` - PDF version 1.6, 128-bit AES is used * `1.7` - PDF version 1.7, 128-bit AES is used * `1.7ext3` - PDF version 1.7 ExtensionLevel 3, 256-bit AES is used When using PDF version 1.7 ExtensionLevel 3, password is truncated to 127 bytes of its UTF-8 representation. In older versions, password is truncated to 32 bytes, and only Latin-1 characters are allowed. [Compression](https://pdfmake.github.io/docs/0.3/document-definition-object/compression/ "Compression") [Attachments embedding](https://pdfmake.github.io/docs/0.3/document-definition-object/attachments/ "Attachments embedding") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Patterns ======== Patterns can be defined as a dictionary of predefined patterns in the document definition. Only tiling patterns are supported. #### Pattern definition Each pattern is defined using: * `boundingBox` - bounding box used to clip the pattern cell * `xStep` - horizontal spacing between cells * `yStep` - vertical spacing between cells * `pattern` - a PDF stream of operations that render the graphics/text of the cell For more information on each property and patterns in general see the [PDF reference](https://www.adobe.com/content/dam/acom/en/devnet/pdf/pdfs/pdf_reference_archives/PDFReference.pdf) , section 4.6 and 4.6.2 specifically on tiling patterns. #### Pattern definition example Basic pattern that produces a 45° stripe pattern: `var docDefinition = { content: ["..."], patterns: { stripe45d: { boundingBox: [1, 1, 4, 4], xStep: 3, yStep: 3, pattern: "1 w 0 1 m 4 5 l s 2 0 m 5 3 l s", }, }, };` The output can be seen in the vector example. #### Usage in vectors, tables and text The following properties are available. For text: * `background` - set as background for text (see styling\_properties example) For vectors: * `color` - set as fill for a vector (see the rectangle in vector example) For table cells: * `fillColor` - cell (background) fill color * `overlayPattern` - overlay for a cell, painted over the contents * `overlayOpacity` - the opacity of the overlay Each of the above properties is defined as a tuple `[string, string]`. The first element is the key in the patterns dictionary and the second is the color to use to paint the pattern. #### Examples Text: `{ text: 'Insert lorem. And ipsum', background: ['stripe45d', 'gray'] }` Vector: `{ type: 'rect', x: 10, y: 250, w: 50, h: 30, color: ['stripe45d', 'blue'], }` Table (as used in table cells): `{ text: 'Sample value', fillOpacity: 0.85, fillColor: ['stripe45d', 'blue'] }` `{ text: 'Sample value', fillOpacity: 0.15, fillColor: 'blue', overlayPattern: ['stripe45d', 'gray'], overlayOpacity: 0.15 }` [Document Metadata](https://pdfmake.github.io/docs/0.3/document-definition-object/document-medatadata/ "Document Metadata") [Compression](https://pdfmake.github.io/docs/0.3/document-definition-object/compression/ "Compression") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options PDF/A ===== PDF/A is specialized for use in the archiving and long-term preservation of electronic documents. PDF version 1.4 or above is required. `var docDefinition = { version: '1.5', subset: 'PDF/A-3a', tagged: true, displayTitle: true, info: { title: 'Awesome PDF document from pdfmake' }, content: [ 'PDF/A document for archive' ] };` Supported PDF versions (property `version`): * `1.3` - PDF version 1.3 (default) **not supported PDF/A** * `1.4` - PDF version 1.4 * `1.5` - PDF version 1.5 * `1.6` - PDF version 1.6 * `1.7` - PDF version 1.7 * `1.7ext3` - PDF version 1.7 ExtensionLevel 3 Subset of document (property `subset`): * `PDF/A-1` (shortcut for PDF/A-1b) * `PDF/A-1a` * `PDF/A-1b` * `PDF/A-2` (shortcut for PDF/A-2b) * `PDF/A-2a` * `PDF/A-2b` * `PDF/A-3` (shortcut for PDF/A-3b) * `PDF/A-3a` * `PDF/A-3b` * `PDF/UA` Mark document as Tagged PDF (property `tagged`) * `true` - enable * `false` - disable Display of document title in window title (property `displayTitle`) * `true` - enable * `false` - disable [Attachments embedding](https://pdfmake.github.io/docs/0.3/document-definition-object/attachments/ "Attachments embedding") [Options](https://pdfmake.github.io/docs/0.3/options/ "Options") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Attachments embedding ===================== pdfmake supports attaching files as annotations as well as embedded files. Embedded files are added in the “files” dictionary and will show up in supported pdf viewers in their respective attachment panels. File attachments are annotations which link to a file. Any attachment or embedded file must provide at least a “src”, providing a filename through “name” is highly recommended. The “src” of any attachment can be provided in dataURL format (like the following attachment, taken from [http://www.clipartbest.com/clipart-dT7zx5rT9),](http://www.clipartbest.com/clipart-dT7zx5rT9),) but local files are allowed as well. `var dd = { content: [ 'Any attachment or embedded file must provide at least a "src", providing a filename through "name" is highly recommended.', 'The "src" of any attachment can be provided in dataURL format (like the following attachment, taken from http://www.clipartbest.com/clipart-dT7zx5rT9), but local files are allowed as well.', { attachment: { src: 'data:image/png;base64,iVBOR....', name: 'testImage.png' } }, 'You can also define an attachment in the "attachments" dictionary and reference it by name.', { attachment: 'sampleImage' }, 'And there are three different standard icons for attachments, "GraphPush", "Paperclip", and "Push" (the default value). Set them with the "icon" option.', { attachment: 'sampleImage', icon: 'GraphPush' }, { attachment: 'sampleImage', icon: 'Paperclip' }, { attachment: 'sampleImage', icon: 'Push' }, 'For better customization, add an image and attach a file to it with linkToFile:', { image: 'fonts/sampleImage.jpg', width: 150, linkToFile: 'sampleImage' }, "You can add a description, which will show in your pdf viewer's attachments panel and as a tooltip when hovering over the attachment.", { attachment: { src: 'data:image/png;base64,iVBOR....', name: 'withDescription.png', description: 'file description' } }, 'You can also define the "src" of an attachment or embedded file in the "attachments" and "files" dictionary via URL address.', ], attachments: { sampleImage: { src: 'fonts/sampleImage.jpg', name: 'sampleImage.png' } }, files: { README: { src: 'https://raw.githubusercontent.com/bpampuch/pdfmake/master/README.md', name: 'pdfmake README.md' } } };` [Encryption and access privileges](https://pdfmake.github.io/docs/0.3/document-definition-object/security/ "Encryption and access privileges") [PDF/A](https://pdfmake.github.io/docs/0.3/document-definition-object/pdfa/ "PDF/A") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Document sections \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- Attachments embedding \- PDF/A Options Tags ==== [Migration from 0.1/0.2](https://pdfmake.github.io/docs/0.3/migration-from-0.1/ "Migration from 0.1/0.2") --- # pdfmake Navigation : Migration from 0.1/0.2 Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Methods \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Options Categories ========== [Migration from 0.1/0.2](https://pdfmake.github.io/docs/0.3/migration-from-0.1/ "Migration from 0.1/0.2") --- # pdfmake Navigation : [navigation](https://pdfmake.github.io/docs/#) pdfmake ======= ### Choose pdfmake version * [Version 0.1.x and 0.2.x](https://pdfmake.github.io/docs/0.1/) * [Version 0.3.x](https://pdfmake.github.io/docs/0.3/) --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options [navigation](https://pdfmake.github.io/docs/0.1/#) pdfmake ======= PDF document generation library for server-side and client-side usage in pure JavaScript. Features -------- ##### basics * line-wrapping * text-alignments _(left, right, centered, justified)_ * numbered and bulleted lists * margins * images and vector graphics ##### styling * convenient styling * style inheritance * custom style dictionaries ##### tables and columns * auto/fixed/star-sized/percentage columns widths * col-spans and row-spans * headers _automatically repeated in case of a page-break_ * non-breaking rows * non-breaking sections _keeping headers and rows together_ ##### page headers and footers * static or dynamic content * page numbers * page count ##### other * page dimensions and orientations * background-layer * custom page breaks * font embedding * support for complex, multi-level (nested) structures * table of contents * setting of PDF metadata _(e.g. author, subject)_ * tiling patterns ##### client-side helper methods * download _with the specified filename_ * open _in another tab_ * print _auto-triggering print_ Examples -------- Check out [the playground](http://bpampuch.github.io/pdfmake/playground.html) and [examples](https://github.com/bpampuch/pdfmake/tree/0.2/examples) (for version [0.1.x](https://github.com/bpampuch/pdfmake/tree/0.2/examples) ). [Getting started](https://pdfmake.github.io/docs/0.1/getting-started/ "Getting started") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \--- Building font file via PHP script \--- Building font file via shell script \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Compression \- Encryption and access privileges Options 404 Page not found ================== Error ===== Woops. Looks like this page doesn't exist. [Go to homepage](https://pdfmake.github.io/docs/0.1/) [![](https://pdfmake.github.io/docs/0.1/images/gopher-404.jpg)](https://pdfmake.github.io/docs/0.1/images/gopher-404.jpg) [Getting started](https://pdfmake.github.io/docs/0.1/getting-started/ "Getting started") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Getting started =============== Pdfmake is runnable in browser (client-side) and in Node.js (server-side). Usages are described in next chapters. [pdfmake](https://pdfmake.github.io/docs/0.1/ "pdfmake") [Client-side](https://pdfmake.github.io/docs/0.1/getting-started/client-side/ "Client-side") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Client-side =========== To begin in browser with the default configuration, you should include two files: * **pdfmake.min.js**, * **vfs\_fonts.js** - default font definition (it contains Roboto, you can however [use custom fonts instead](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/) ) ` my first pdfmake example ...` ### Library sources #### CDN * [https://app.unpkg.com/pdfmake](https://app.unpkg.com/pdfmake@0.2/files/build) * Version 0.2: * `https://unpkg.com/pdfmake@0.2/build/pdfmake.min.js` * `https://unpkg.com/pdfmake@0.2/build/vfs_fonts.js` * Version 0.1: * `https://unpkg.com/pdfmake@0.1/build/pdfmake.min.js` * `https://unpkg.com/pdfmake@0.1/build/vfs_fonts.js` * [https://www.jsdelivr.com/package/npm/pdfmake](https://www.jsdelivr.com/package/npm/pdfmake?tab=files&path=build) * Version 0.2: * `https://cdn.jsdelivr.net/npm/pdfmake@0.2/build/pdfmake.min.js` * `https://cdn.jsdelivr.net/npm/pdfmake@0.2/build/vfs_fonts.js` * Version 0.1: * `https://cdn.jsdelivr.net/npm/pdfmake@0.1/build/pdfmake.min.js` * `https://cdn.jsdelivr.net/npm/pdfmake@0.1/build/vfs_fonts.js` * [https://cdnjs.com/libraries/pdfmake](https://cdnjs.com/libraries/pdfmake) (The service is currently unavailable.) #### bower (deprecated) `bower install pdfmake` #### npm `npm install pdfmake` Files for client-side is available here: * `require('pdfmake/build/pdfmake.js');` * `require('pdfmake/build/vfs_fonts.js');` Using javascript frameworks: `var pdfMake = require('pdfmake/build/pdfmake.js'); require('pdfmake/build/vfs_fonts.js');` or `var pdfMake = require('pdfmake/build/pdfmake.js'); var pdfFonts = require('pdfmake/build/vfs_fonts.js'); pdfMake.addVirtualFileSystem(pdfFonts);` or `import pdfMake from "pdfmake/build/pdfmake"; import "pdfmake/build/vfs_fonts";` or `import pdfMake from "pdfmake/build/pdfmake"; import pdfFonts from "pdfmake/build/vfs_fonts"; pdfMake.addVirtualFileSystem(pdfFonts);` TypeScript: `import * as pdfMake from "pdfmake/build/pdfmake"; import * as pdfFonts from 'pdfmake/build/vfs_fonts'; (pdfMake).addVirtualFileSystem(pdfFonts);` For Ionic and Angular see [issue](https://github.com/bpampuch/pdfmake/issues/1030) . If a **Cannot read property ‘TYPED\_ARRAY\_SUPPORT’ of undefined** error is thrown, add this to webpack config: `exclude: [ /node_modules/, /pdfmake.js$/ ]` (see [issue](https://github.com/bpampuch/pdfmake/issues/1100#issuecomment-336728521) ) If you are using rollup, and a **Cannot read property ‘pdfMake’ of undefined at vfs\_fonts.js** error is thrown, add this to rollup config: `moduleContext: { './node_modules/pdfmake/build/vfs_fonts.js': 'window', },` Then, if console outputs a **Illegal reassignment to import ‘pdfMake’**, do not assign vfs manually, just import fonts like this: `import 'pdfmake/build/vfs_fonts';` #### Composer You can use asset-packagist.org service, see: [npm-asset/pdfmake](https://asset-packagist.org/package/npm-asset/pdfmake) Example of composer.json: `{ "require": { "npm-asset/pdfmake": "^0.2.20" }, "replace": { "npm-asset/pdfkit": "*", "npm-asset/linebreak": "*", "npm-asset/iconv-lite": "*", "npm-asset/svg-to-pdfkit": "*", "npm-asset/xmldoc": "*" }, "repositories": [ { "type": "composer", "url": "https://asset-packagist.org" } ] }` #### Repository Copy them directly from the build directory from the repository. Otherwise you can always build it from sources: * [instructions for version 0.2.x](https://github.com/bpampuch/pdfmake/tree/0.2#building-from-sources-version-02x) * [instructions for version 0.1.x](https://github.com/bpampuch/pdfmake/tree/0.1#building-from-sources-version-01x) [Getting started](https://pdfmake.github.io/docs/0.1/getting-started/ "Getting started") [Methods](https://pdfmake.github.io/docs/0.1/getting-started/client-side/methods/ "Methods") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Methods ======= #### Download the PDF `pdfMake.createPdf(docDefinition).download();` Parameters: * `defaultFileName` _(optional)_ - file name * `cb` _(optional)_ - callback function * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) #### Open the PDF in a new window `pdfMake.createPdf(docDefinition).open();` Parameters: * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) * `win` _(optional)_ - window (when an asynchronous operation) Name can be defined only by using metadata `title` property (see [Document metadata](https://pdfmake.github.io/docs/0.1/document-definition-object/document-medatadata/) ). Asynchronous example: `$scope.generatePdf = function() { // create the window before the callback var win = window.open('', '_blank'); $http.post('/someUrl', data).then(function(response) { // pass the "win" argument pdfMake.createPdf(docDefinition).open({}, win); }); };` Open in same window: `pdfMake.createPdf(docDefinition).open({}, window);` #### Print the PDF `pdfMake.createPdf(docDefinition).print();` Parameters: * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) * `win` _(optional)_ - window (when an asynchronous operation) Asynchronous example: `$scope.generatePdf = function() { // create the window before the callback var win = window.open('', '_blank'); $http.post('/someUrl', data).then(function(response) { // pass the "win" argument pdfMake.createPdf(docDefinition).print({}, win); }); };` Print in same window: `pdfMake.createPdf(docDefinition).print({}, window);` #### Put the PDF into your own page as URL data `const pdfDocGenerator = pdfMake.createPdf(docDefinition); pdfDocGenerator.getDataUrl((dataUrl) => { const targetElement = document.querySelector('#iframeContainer'); const iframe = document.createElement('iframe'); iframe.src = dataUrl; targetElement.appendChild(iframe); });` Parameters: * `cb` - callback function * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) #### Get the PDF as base64 data `const pdfDocGenerator = pdfMake.createPdf(docDefinition); pdfDocGenerator.getBase64((data) => { alert(data); });` Parameters: * `cb` - callback function * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) #### Get the PDF as buffer `const pdfDocGenerator = pdfMake.createPdf(docDefinition); pdfDocGenerator.getBuffer((buffer) => { // ... });` Parameters: * `cb` - callback function * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) #### Get the PDF as Blob `const pdfDocGenerator = pdfMake.createPdf(docDefinition); pdfDocGenerator.getBlob((blob) => { // ... });` Parameters: * `cb` - callback function * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) #### Get PDFKit document object as stream ##### Asynchronous call Minimal version: **0.1.66** `const pdfDocGenerator = pdfMake.createPdf(docDefinition); pdfDocGenerator.getStream((document) => { // ... });` Parameters: * `cb` - callback function ##### Synchronous call Minimal version: **0.1.41** **The preferred way is asynchronous call.** **Unable to download real font files from url (https:// or http://). Asynchronous call required.** `const pdfDocGenerator = pdfMake.createPdf(docDefinition); var document = pdfDocGenerator.getStream();` [Client-side](https://pdfmake.github.io/docs/0.1/getting-started/client-side/ "Client-side") [Supported browsers](https://pdfmake.github.io/docs/0.1/getting-started/client-side/supported-browsers/ "Supported browsers") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Supported browsers ================== * Internet Explorer 11 * Edge 12+ * Firefox * Chrome * Chrome (Android) * Opera * Safari (iOS) * Safari (iOS) iPhone Internet Explorer 10 supports only version 0.1.x. Limitations Methods **`open()`** and **`print()`** are supported only in: * Firefox * Chrome * Opera Add-ons used in browsers can affect the functionality of pdfmake (especially for `open()` and `print()`). If pdfmake is not working try disable add-ons in browser. Problematic add-ons AdBlock Fully description is available in [issue](https://github.com/bpampuch/pdfmake/issues/800) . [Methods](https://pdfmake.github.io/docs/0.1/getting-started/client-side/methods/ "Methods") [Examples](https://pdfmake.github.io/docs/0.1/getting-started/client-side/examples/ "Examples") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Examples ======== Check out [the playground](http://bpampuch.github.io/pdfmake/playground.html) and [examples](https://github.com/bpampuch/pdfmake/tree/0.2/examples) (for version [0.1.x](https://github.com/bpampuch/pdfmake/tree/0.2/examples) ). [Supported browsers](https://pdfmake.github.io/docs/0.1/getting-started/client-side/supported-browsers/ "Supported browsers") [Server-side](https://pdfmake.github.io/docs/0.1/getting-started/server-side/ "Server-side") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Examples ======== see [examples](https://github.com/bpampuch/pdfmake/tree/0.1/examples) and [dev-playground server script](https://github.com/bpampuch/pdfmake/blob/0.1/dev-playground/server.js) [Supported Node.js versions](https://pdfmake.github.io/docs/0.1/getting-started/server-side/supported-nodejs-versions/ "Supported Node.js versions") [Examples from the community](https://pdfmake.github.io/docs/0.1/getting-started/examples-from-comunity/ "Examples from the community") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Supported Node.js versions ========================== * 18 LTS (End-of-life: April 2025) * 20 LTS (End-of-life: April 2026) * 22 LTS (End-of-life: April 2027) * 24 LTS (End-of-life: April 2028) Latest version with support 12 LTS, 14 LTS, 16 LTS is 0.2.12. Version 0.1.x supports Node.js 8 LTS, 10 LTS, 12 LTS, 14 LTS [Server-side](https://pdfmake.github.io/docs/0.1/getting-started/server-side/ "Server-side") [Examples](https://pdfmake.github.io/docs/0.1/getting-started/server-side/examples/ "Examples") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Examples from the community =========================== * [vue.js example](https://github.com/bpampuch/pdfmake/issues/2498) * [react-native example](https://github.com/ieschalier/rn-pdfmake) [Examples](https://pdfmake.github.io/docs/0.1/getting-started/server-side/examples/ "Examples") [Fonts](https://pdfmake.github.io/docs/0.1/fonts/ "Fonts") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Fonts ===== Usage of fonts in next chapters. [Examples from the community](https://pdfmake.github.io/docs/0.1/getting-started/examples-from-comunity/ "Examples from the community") [Custom fonts (client-side)](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/ "Custom fonts (client-side)") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Server-side =========== On server-side you can simply install via npm: `npm install pdfmake` #### Example of usage: `// Define font files var fonts = { Roboto: { normal: 'fonts/Roboto-Regular.ttf', bold: 'fonts/Roboto-Medium.ttf', italics: 'fonts/Roboto-Italic.ttf', bolditalics: 'fonts/Roboto-MediumItalic.ttf' } }; var PdfPrinter = require('pdfmake'); var printer = new PdfPrinter(fonts); var fs = require('fs'); var docDefinition = { // ... }; var options = { // ... } var pdfDoc = printer.createPdfKitDocument(docDefinition, options); pdfDoc.pipe(fs.createWriteStream('document.pdf')); pdfDoc.end();` Parameters for `createPdfKitDocument`: * `docDefinition` - object with document definition * `options` _(optional)_ - advanced options see [options chapter](https://pdfmake.github.io/docs/0.1/options/) [Examples](https://pdfmake.github.io/docs/0.1/getting-started/client-side/examples/ "Examples") [Supported Node.js versions](https://pdfmake.github.io/docs/0.1/getting-started/server-side/supported-nodejs-versions/ "Supported Node.js versions") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Custom fonts (client-side) ========================== pdfmake uses the Roboto font by default. This guide explains how to use your own fonts with pdfmake (in client-side code). Two ways are now possible: -------------------------- * [use virtual file system](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/vfs/) * **(NEW)** [use font file via URL (https:// or http:// protocol)](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/url/) [Fonts](https://pdfmake.github.io/docs/0.1/fonts/ "Fonts") [via Virtual file system (VFS)](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/vfs/ "via Virtual file system (VFS)") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Icons ===== * make a font at [http://fontello.com/](http://fontello.com/) or something and download it * from font file (for example .ttf) create vfs\_fonts.js file (see how to [use custom fonts](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/#1-create-a-new-vfs-fonts-js-containing-your-font-files) ) * define font in js (just defining normal might be enough): `pdfMake.fonts = { Fontello: { normal: 'fontello.ttf', bold: 'fontello.ttf', italics: 'fontello.ttf', bolditalics: 'fontello.ttf' } }` * add a style for icons: `icon: { font: 'Fontello' }` * make a text paragraph: `{ text: '', style: 'icon' }, //icon wifi` * as the text you copy from the fontello-codes.css from the comments (not the escaped value) * * * If you need an icon within text, you need to nest text objects: `text: [ { text: '', style: 'icon' }, //icon gift " my present" ]` this puts out: “\[gift icon\] my present” [via URL protocol](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/url/ "via URL protocol") [Standard 14 fonts](https://pdfmake.github.io/docs/0.1/fonts/standard-14-fonts/ "Standard 14 fonts") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options via URL protocol ================ Minimal version: **0.1.66** This feature is available only in **client-side** (in browser). To use custom fonts, 2 steps are required: 1. assign `pdfMake.fonts` your font files accessible via url address in your javascript 2. specify the font in your doc-definition 1\. assign `pdfMake.fonts` your font files in your javascript ------------------------------------------------------------- Font files must be accessible via url address (https:// or http:// protocol). In your code, before calling `pdfMake.createPdf(docDefinition)` set `pdfMake.fonts` as in the example below: `pdfMake.fonts = { yourFontName: { normal: 'https://example.com/fonts/fontFile.ttf', bold: 'https://example.com/fonts/fontFile2.ttf', italics: 'https://example.com/fonts/fontFile3.ttf', bolditalics: 'https://example.com/fonts/fontFile4.ttf' }, anotherFontName: { (...) }, // download default Roboto font from cdnjs.com Roboto: { normal: 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-Regular.ttf', bold: 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-Medium.ttf', italics: 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-Italic.ttf', bolditalics: 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-MediumItalic.ttf' }, // example of usage fonts in collection PingFangSC: { normal: ['https://example.com/fonts/pingfang.ttc', 'PingFangSC-Regular'], bold: ['https://example.com/fonts/pingfang.ttc', 'PingFangSC-Semibold'], } }` Alternatively, instead of changing the global value, you can pass the `fonts` object directly to `createPdf`: `pdfMake.createPdf(docDefinition, null, fonts)` 2\. specify the font in your doc-definition ------------------------------------------- pdfMake uses ‘Roboto’ as default font, so in order to use your font, you should specify it in your doc-definition object. The easiest way is to set it globally in the **defaultStyle** `var docDefinition = { content: (...), defaultStyle: { font: 'yourFontName' } }` [via Virtual file system (VFS)](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/vfs/ "via Virtual file system (VFS)") [Icons](https://pdfmake.github.io/docs/0.1/fonts/icons/ "Icons") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Standard 14 fonts ================= PDF contains [standard 14 fonts](http://www.enfocus.com/manuals/ReferenceGuide/PS/18/enUS/en-us/common/pse/concept/c_aa1044513.html) . **Attention!** This fonts supports only **ANSI** code page (only english characters)! Use in pdfmake on server-side ----------------------------- **Example of usage:** `var fonts = { Courier: { normal: 'Courier', bold: 'Courier-Bold', italics: 'Courier-Oblique', bolditalics: 'Courier-BoldOblique' }, Helvetica: { normal: 'Helvetica', bold: 'Helvetica-Bold', italics: 'Helvetica-Oblique', bolditalics: 'Helvetica-BoldOblique' }, Times: { normal: 'Times-Roman', bold: 'Times-Bold', italics: 'Times-Italic', bolditalics: 'Times-BoldItalic' }, Symbol: { normal: 'Symbol' }, ZapfDingbats: { normal: 'ZapfDingbats' } }; var PdfPrinter = require('pdfmake'); var printer = new PdfPrinter(fonts); var fs = require('fs'); var docDefinition = { content: [ 'First paragraph', 'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines', ], defaultStyle: { font: 'Helvetica' } }; var pdfDoc = printer.createPdfKitDocument(docDefinition); pdfDoc.pipe(fs.createWriteStream('document.pdf')); pdfDoc.end();` Use in pdfmake on client-side ----------------------------- Is not supported by default, because this increase size of pdfmake library file about **700 kB**. If you really need it, you can build with standard fonts by `gulp buildWithStandardFonts` command. **Building with standard fonts from sources:** `git clone --branch 0.2 https://github.com/bpampuch/pdfmake.git cd pdfmake npm install npm run build:browser-standard-fonts` or for version 0.1.x: `git clone --branch 0.1 https://github.com/bpampuch/pdfmake.git cd pdfmake npm install gulp buildWithStandardFonts` **Example of usage:** `pdfMake.fonts = { Courier: { normal: 'Courier', bold: 'Courier-Bold', italics: 'Courier-Oblique', bolditalics: 'Courier-BoldOblique' }, Helvetica: { normal: 'Helvetica', bold: 'Helvetica-Bold', italics: 'Helvetica-Oblique', bolditalics: 'Helvetica-BoldOblique' }, Times: { normal: 'Times-Roman', bold: 'Times-Bold', italics: 'Times-Italic', bolditalics: 'Times-BoldItalic' }, Symbol: { normal: 'Symbol' }, ZapfDingbats: { normal: 'ZapfDingbats' } }; var docDefinition = { content: [ 'First paragraph', 'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines', ], defaultStyle: { font: 'Helvetica' } }; pdfMake.createPdf(docDefinition).download('document.pdf');` [Icons](https://pdfmake.github.io/docs/0.1/fonts/icons/ "Icons") [Document-definition-object](https://pdfmake.github.io/docs/0.1/document-definition-object/ "Document-definition-object") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Document-definition-object ========================== pdfmake follows a declarative approach. It basically means, you’ll never have to calculate positions manually or use commands like: `writeText(text, x, y)`, `moveDown` etc…, as you would with a lot of other libraries. The most fundamental concept to be mastered is the document-definition-object which can be as simple as: `var docDefinition = { content: 'This is an sample PDF printed with pdfMake' };` or become pretty complex (having multi-level tables, images, lists, paragraphs, margins, styles etc…). #### Units All numbers are in points (pt) unit (sometimes labeled as PDF/PostScript points). [Standard 14 fonts](https://pdfmake.github.io/docs/0.1/fonts/standard-14-fonts/ "Standard 14 fonts") [Styling](https://pdfmake.github.io/docs/0.1/document-definition-object/styling/ "Styling") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Columns ======= By default paragraphs are rendered as a vertical stack of elements (one below another). It is possible however to divide available space into columns. `var docDefinition = { content: [ 'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', { columns: [ { // auto-sized columns have their widths based on their content width: 'auto', text: 'First column' }, { // star-sized columns fill the remaining space // if there's more than one star-column, available width is divided equally width: '*', text: 'Second column' }, { // fixed width width: 100, text: 'Third column' }, { // % width width: '20%', text: 'Fourth column' } ], // optional space between columns columnGap: 10 }, 'This paragraph goes below all columns and has full width' ] };` Column content is not limited to a simple text. It can actually contain any valid pdfmake element. Make sure to look at the COLUMNS example in [playground](http://pdfmake.org/playground.html) . ##### Properties * `columnGap: number` specify gap (space) between columns [Styling](https://pdfmake.github.io/docs/0.1/document-definition-object/styling/ "Styling") [Tables](https://pdfmake.github.io/docs/0.1/document-definition-object/tables/ "Tables") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Headers and footers =================== Page headers and footers in pdfmake can be: _static_ or _dynamic_. They use the same syntax: `var docDefinition = { header: 'simple text', footer: { columns: [ 'Left part', { text: 'Right part', alignment: 'right' } ] }, content: (...) };` For dynamically generated content (including page numbers, page count and page size) you can pass a function to the header or footer: `var docDefinition = { footer: function(currentPage, pageCount) { return currentPage.toString() + ' of ' + pageCount; }, header: function(currentPage, pageCount, pageSize) { // you can apply any logic and return any valid pdfmake element return [ { text: 'simple text', alignment: (currentPage % 2) ? 'left' : 'right' }, { canvas: [ { type: 'rect', x: 170, y: 32, w: pageSize.width - 170, h: 40 } ] } ] }, (...) };` [Lists](https://pdfmake.github.io/docs/0.1/document-definition-object/lists/ "Lists") [Background-layer](https://pdfmake.github.io/docs/0.1/document-definition-object/background-layer/ "Background-layer") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Lists ===== pdfmake supports both numbered and bulleted lists: `var docDefinition = { content: [ 'Bulleted list example:', { // to treat a paragraph as a bulleted list, set an array of items under the ul key ul: [ 'Item 1', 'Item 2', 'Item 3', { text: 'Item 4', bold: true }, ] }, 'Numbered list example:', { // for numbered lists set the ol key ol: [ 'Item 1', 'Item 2', 'Item 3' ] }, 'Colored unordered list:', { color: 'blue', ul: [ 'item 1', 'item 2', 'item 3' ] }, 'Colored unordered list with own marker color:', { color: 'blue', markerColor: 'red', ul: [ 'item 1', 'item 2', { text: 'item 3 with custom marker color', markerColor: 'lime' } // Minimal pdfmake version: 0.2.23 ] }, 'Colored ordered list', { color: 'blue', ol: [ 'item 1', 'item 2', 'item 3' ] }, 'Colored ordered list with own marker color:', { color: 'blue', markerColor: 'red', ol: [ 'item 1', 'item 2', { text: 'item 3 with custom marker color', markerColor: 'lime' } // Minimal pdfmake version: 0.2.23 ] }, ] };` [Tables](https://pdfmake.github.io/docs/0.1/document-definition-object/tables/ "Tables") [Headers and footers](https://pdfmake.github.io/docs/0.1/document-definition-object/headers-footers/ "Headers and footers") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Tables ====== Conceptually tables are similar to columns. They can however have headers, borders and cells spanning over multiple columns/rows. The table node expects a valid table value. If the value is invalid or empty, an error is thrown. This includes the table.body property as well. `var docDefinition = { content: [ { layout: 'lightHorizontalLines', // optional table: { // headers are automatically repeated if the table spans over multiple pages // you can declare how many rows should be treated as headers headerRows: 1, widths: [ '*', 'auto', 100, '*' ], body: [ [ 'First', 'Second', 'Third', 'The last one' ], [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ], [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ] ] } } ] };` ##### Table-cell properties * `fillColor: string`: the background color of a table cell * `fillOpacity: string`: the background opacity of a table cell ##### Table layouts Can be used `layout` property for set table layout. Available table layouts: * `noBorders` * `headerLineOnly` * `lightHorizontalLines` ##### Own table layouts Own table layouts must be defined before calling `pdfMake.createPdf(docDefinition)`. `pdfMake.tableLayouts = { exampleLayout: { hLineWidth: function (i, node) { if (i === 0 || i === node.table.body.length) { return 0; } return (i === node.table.headerRows) ? 2 : 1; }, vLineWidth: function (i) { return 0; }, hLineColor: function (i) { return i === 1 ? 'black' : '#aaa'; }, paddingLeft: function (i) { return i === 0 ? 0 : 8; }, paddingRight: function (i, node) { return (i === node.table.widths.length - 1) ? 0 : 8; } } }; // download the PDF pdfMake.createPdf(docDefinition).download();` Alternatively, you can pass the tableLayouts directly to `createPdf` without changing the global value: * On the client side: `pdfMake.createPdf(docDefinition, tableLayouts).download(); // The full signature of createPdf looks like this. // tableLayouts, fonts and vfs are all optional - falsy values will cause // pdfMake.tableLayouts, pdfMake.fonts or pdfMake.vfs to be used. pdfMake.createPdf(docDefinition, tableLayouts, fonts, vfs)` * On the server side: `var PdfPrinter = require('pdfmake'); var printer = new PdfPrinter(fonts); // Declaring your layout var myTableLayouts = { exampleLayout: { /* Your layout here. */ } }; // Building the PDF var pdfDoc = printer.createPdfKitDocument(docDefinition, {tableLayouts: myTableLayouts}); // Writing it to disk pdfDoc.pipe(fs.createWriteStream('document.pdf')); pdfDoc.end();` ##### colSpan and rowSpan If you use colSpan or rowSpan, don’t forget to use an empty cell for the next columns or rows. See example below. `var dd = { content: [ { table: { body: [ [{text: 'Header with Colspan = 2', style: 'tableHeader', colSpan: 2, alignment: 'center'}, '', {text: 'Header 3', style: 'tableHeader', alignment: 'center'}], [{text: 'Header 1', style: 'tableHeader', alignment: 'center'}, {text: 'Header 2', style: 'tableHeader', alignment: 'center'}, {text: 'Header 3', style: 'tableHeader', alignment: 'center'}], ['Sample value 1', 'Sample value 2', 'Sample value 3'], [{rowSpan: 3, text: 'rowSpan set to 3\nLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor'}, 'Sample value 2', 'Sample value 3'], ['', 'Sample value 2', 'Sample value 3'], ['Sample value 1', 'Sample value 2', 'Sample value 3'], ['Sample value 1', {colSpan: 2, rowSpan: 2, text: 'Both:\nrowSpan and colSpan\ncan be defined at the same time'}, ''], ['Sample value 1', '', ''], ] } } ] }` All concepts related to tables are covered by TABLES example in [playground](http://pdfmake.org/playground.html) . [Columns](https://pdfmake.github.io/docs/0.1/document-definition-object/columns/ "Columns") [Lists](https://pdfmake.github.io/docs/0.1/document-definition-object/lists/ "Lists") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Background-layer ================ The background-layer will be added on every page. `var docDefinition = { background: 'simple text', content: (...) };` It may contain any other object as well (images, tables, …) or be dynamically generated: ``var docDefinition = { background: function(currentPage, pageSize) { return `page ${currentPage} with size ${pageSize.width} x ${pageSize.height}` }, content: (...) };`` [Headers and footers](https://pdfmake.github.io/docs/0.1/document-definition-object/headers-footers/ "Headers and footers") [Margins](https://pdfmake.github.io/docs/0.1/document-definition-object/margins/ "Margins") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options via Virtual file system (VFS) ============================= This article is only for **client-side usage** (in browser)! For server-side use **real font files**. Minimal version: **0.1.72** **Files are compatible.** For older versions use gulp. TL;DR ----- pdfmake uses a 2nd file: `vfs_fonts.js` for fonts (and other files) you wish to embed into your generated PDFs. When you run command `node build-vfs.js "./examples/fonts"` in the pdfmake package directory a new `build/vfs_fonts.js` file is created containing an **embedded copy** of all files from the local `examples/fonts` subdirectory (in a key/value object `pdfMake.vfs`). Detailed Instructions ===================== To use custom fonts, 3 steps are required: 1. create a new `vfs_fonts.js` file containing your font files 2. assign `pdfMake.addFonts(...)` (or legacy `pdfMake.fonts`) in your javascript 3. specify the font in your doc-definition 1\. create a new `vfs_fonts.js` containing your font files ---------------------------------------------------------- * Install pdfmake `npm install pdfmake` * Go to package directory `./node_modules/pdfmake/` * Create the `examples/fonts` subdirectory in your pdfmake code directory, if it doesn’t already exist. * Copy your fonts (and other files you wish to embed) into the `examples/fonts` subdirectory. * Run command `node build-vfs.js "./examples/fonts"`. Or run `node build-vfs.js` to show help. * Include your new **build/vfs\_fonts.js** file in your code (in the same way you include `pdfmake.js` or `pdfmake.min.js`). It is recommended to **move** `vfs_fonts.js` file into your own folder structure (should not be in `node_modules` folder). The next time you run `npm install` it might get replaced in `node_modules` with the original content. If your framework caches `node_modules` folder the changes may not take effect. Clear the cache or move `vfs_fonts.js` file outside of `node_modules` folder. The above steps embeds **all** files from `examples/fonts` (into a local key/value variable `pdfMake.vfs`) - not only fonts. Which means you could put images in there, run `node build-vfs.js "./examples/fonts`, and reference them by filename in your doc-definition object. You don’t need to reference the files in `examples/fonts` anymore because all files have been copied to the `vfs_fonts.js`. For building script in other languages see [https://github.com/pdfmake/vfs-builders](https://github.com/pdfmake/vfs-builders) . 2\. assign `pdfMake.addFonts(...)` (or legacy `pdfMake.fonts`) in your javascript --------------------------------------------------------------------------------- In your code, before calling `pdfMake.createPdf(docDefinition)` set `pdfMake.addFonts(...)` (or legacy `pdfMake.fonts`) as in the example below (notice we don’t specify paths, just filenames): `pdfMake.addFonts({ yourFontName: { normal: 'fontFile.ttf', bold: 'fontFile2.ttf', italics: 'fontFile3.ttf', bolditalics: 'fontFile4.ttf' }, anotherFontName: { (...) }, // example of usage fonts in collection PingFangSC: { normal: ['pingfang.ttc', 'PingFangSC-Regular'], bold: ['pingfang.ttc', 'PingFangSC-Semibold'], } });` or legacy: `pdfMake.fonts = { yourFontName: { normal: 'fontFile.ttf', bold: 'fontFile2.ttf', italics: 'fontFile3.ttf', bolditalics: 'fontFile4.ttf' }, anotherFontName: { (...) }, // example of usage fonts in collection PingFangSC: { normal: ['pingfang.ttc', 'PingFangSC-Regular'], bold: ['pingfang.ttc', 'PingFangSC-Semibold'], } }` The keys defined here will be used as font names in your doc-definition styles. Each font-family defines 4 properties: normal, bold, italics and bolditalics referring to appropriate files (the ones you embedded from `examples/fonts/`). You should define all 4 components (even if they all point to the same font file). By default pdfmake uses the following font structure: `pdfMake.addFonts({ Roboto: { normal: 'Roboto-Regular.ttf', bold: 'Roboto-Medium.ttf', italics: 'Roboto-Italic.ttf', bolditalics: 'Roboto-MediumItalic.ttf' } });` or legacy: `pdfMake.fonts = { Roboto: { normal: 'Roboto-Regular.ttf', bold: 'Roboto-Medium.ttf', italics: 'Roboto-Italic.ttf', bolditalics: 'Roboto-MediumItalic.ttf' } };` Alternatively, instead of changing the global value, you can pass the `fonts` object directly to `createPdf`: `pdfMake.createPdf(docDefinition, null, fonts) // The full signature of createPdf looks like this. // tableLayouts, fonts and vfs are all optional - falsy values will cause // pdfMake.tableLayouts, pdfMake.fonts or pdfMake.vfs to be used. pdfMake.createPdf(docDefinition, tableLayouts, fonts, vfs)` 3\. specify the font in your doc-definition ------------------------------------------- pdfMake uses ‘Roboto’ as default font, so in order to use your font, you should specify it in your doc-definition object. The easiest way is to set it globally in the **defaultStyle** `var docDefinition = { content: (...), defaultStyle: { font: 'yourFontName' } }` [Custom fonts (client-side)](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/ "Custom fonts (client-side)") [via URL protocol](https://pdfmake.github.io/docs/0.1/fonts/custom-fonts-client-side/url/ "via URL protocol") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Stack of paragraphs =================== You could have figured out by now (from the examples), that if you set the `content` key to an array, the document becomes a stack of paragraphs. You’ll quite often reuse this structure in a nested element, like in the following example: `var docDefinition = { content: [ 'paragraph 1', 'paragraph 2', { columns: [ 'first column is a simple text', [ // second column consists of paragraphs 'paragraph A', 'paragraph B', 'these paragraphs will be rendered one below another inside the column' ] ] } ] };` The problem with an array is that you cannot add styling properties to it (to change fontSize for example). The good news is - array is just a shortcut in pdfMake for { stack: \[\] }, so if you want to restyle the whole stack, you can do it using the expanded definition: `var docDefinition = { content: [ 'paragraph 1', 'paragraph 2', { columns: [ 'first column is a simple text', { stack: [ // second column consists of paragraphs 'paragraph A', 'paragraph B', 'these paragraphs will be rendered one below another inside the column' ], fontSize: 15 } ] } ] };` [Margins](https://pdfmake.github.io/docs/0.1/document-definition-object/margins/ "Margins") [Images](https://pdfmake.github.io/docs/0.1/document-definition-object/images/ "Images") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Margins ======= Any element in pdfMake can have a margin: `// margin: [left, top, right, bottom] { text: 'sample', margin: [ 5, 2, 10, 20 ] }, // margin: [horizontal, vertical] { text: 'another text', margin: [5, 2] }, // margin: equalLeftTopRightBottom { text: 'last one', margin: 5 } // single-side margins { text: 'sample', marginLeft: 5, marginTop: 2, marginRight: 10, marginBottom: 2 },` [Background-layer](https://pdfmake.github.io/docs/0.1/document-definition-object/background-layer/ "Background-layer") [Stack of paragraphs](https://pdfmake.github.io/docs/0.1/document-definition-object/stack/ "Stack of paragraphs") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Styling ======= pdfmake makes it possible to style any paragraph or its part: `var docDefinition = { content: [ // if you don't need styles, you can use a simple string to define a paragraph 'This is a standard paragraph, using default style', // using a { text: '...' } object lets you set styling properties { text: 'This paragraph will have a bigger font', fontSize: 15 }, // if you set the value of text to an array instead of a string, you'll be able // to style any part individually { text: [ 'This paragraph is defined as an array of elements to make it possible to ', { text: 'restyle part of it and make it bigger ', fontSize: 15 }, 'than the rest.' ] } ] };` #### Style dictionaries It’s also possible to define a dictionary of reusable styles: `var docDefinition = { content: [ { text: 'This is a header', style: 'header' }, 'No styling here, this is a standard paragraph', { text: 'Another text', style: 'anotherStyle' }, { text: 'Multiple styles applied', style: [ 'header', 'anotherStyle' ] } ], styles: { header: { fontSize: 22, bold: true }, anotherStyle: { italics: true, alignment: 'right' } } };` To have a deeper understanding of styling in pdfmake, style inheritance and local-style-overrides check STYLES1, STYLES2 and STYLES3 examples in [playground](http://pdfmake.org/playground.html) . #### Default style And it is also possible to define a default style: `var docDefinition = { content: [ 'Text styled by default style' ], defaultStyle: { fontSize: 15, bold: true } };` #### Style properties * `font: string`: name of the font * `fontSize: number`: size of the font in pt * `fontFeatures: string[]`: array of advanced typographic features supported in TTF fonts (supported features depend on font file) * `lineHeight: number`: the line height (default: 1) * `bold: boolean`: whether to use bold text (default: false) * `italics: boolean`: whether to use italic text (default: false) * `alignment: string`: (‘left’ or ‘center’ or ‘right’ or ‘justify’) the alignment of the text * `characterSpacing: number`: size of the letter spacing in pt * `wordBreak: string`: controls how text is wrapped when it exceeds the available width (supported values: `'normal'` (default), `'break-all'`) (Minimal pdfmake version: 0.2.21) * `color: string`: the color of the text (color name e.g., ‘blue’ or hexadecimal color e.g., ‘#ff5500’) * `background: string` the background color of the text * `markerColor: string`: the color of the bullets in a buletted list * `decoration: string | string[]`: the text decoration to apply (‘underline’ or ‘lineThrough’ or ‘overline’) * `decorationStyle: string`: the style of the text decoration (‘dashed’ or ‘dotted’ or ‘double’ or ‘wavy’) * `decorationColor: string`: the color of the text decoration, see color [Document-definition-object](https://pdfmake.github.io/docs/0.1/document-definition-object/ "Document-definition-object") [Columns](https://pdfmake.github.io/docs/0.1/document-definition-object/columns/ "Columns") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Images ====== This is simple. Just use the `{ image: '...' }` node type. JPEG and PNG formats are supported. The image node expects a valid image value. If the value is invalid or empty, an error is thrown. `var docDefinition = { content: [ { // you'll most often use dataURI images on the browser side // if no width/height/fit is provided, the original size will be used image: 'data:image/jpeg;base64,...encodedContent...' }, { // if you specify width, image will scale proportionally image: 'data:image/jpeg;base64,...encodedContent...', width: 150 }, { // if you specify height, image will scale proportionally // Minimal pdfmake version: 0.2.23 image: 'data:image/jpeg;base64,...encodedContent...', height: 100 }, { // if you specify both width and height - image will be stretched image: 'data:image/jpeg;base64,...encodedContent...', width: 150, height: 150 }, { // you can also fit the image inside a rectangle image: 'data:image/jpeg;base64,...encodedContent...', fit: [100, 100] }, { // You can also cover the image inside a rectangle image: 'data:image/jpeg;base64,...encodedContent...', cover: { width: 100, height: 100, valign: "bottom", align: "right" }, }, { // if you reuse the same image in multiple nodes, // you should put it to to images dictionary and reference it by name image: 'mySuperImage' }, { // under NodeJS (or in case you use virtual file system provided by pdfmake) // you can also pass file names here image: 'myImageDictionary/image1.jpg' }, { // in browser is supported loading images via url from reference by name in images image: 'snow' }, { image: 'strawberries' }, ], images: { mySuperImage: 'data:image/jpeg;base64,...content...', // in browser is supported loading images via url (https or http protocol) (minimal version: 0.1.67) snow: 'https://picsum.photos/seed/picsum/200/300', // is supported loading images via url with custom headers (minimal version: 0.2.5) strawberries: { url: 'https://picsum.photos/id/1080/367/267', headers: { myheader: '123', myotherheader: 'abc', } } } };` [Stack of paragraphs](https://pdfmake.github.io/docs/0.1/document-definition-object/stack/ "Stack of paragraphs") [SVGs](https://pdfmake.github.io/docs/0.1/document-definition-object/svgs/ "SVGs") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options SVGs ==== Minimal version: **0.1.59** SVGs are much like [images](https://pdfmake.github.io/docs/0.1/document-definition-object/images/) except it is not currently possible to refer to SVGs by file or re-use from a dictionary. The SVG node expects a valid SVG value. If the value is invalid or empty, an error is thrown. Library [SVG-to-PDFKit](https://github.com/alafr/SVG-to-PDFKit) is used to transformation from SVG to PDF document. Node `svg` value can be string or `SVGElement` object (is available only in browser). Support of `SVGElement` object required version **0.2.22** or later `var docDefinition = { content: [ { // If no width/height/fit is used, then dimensions from the svg element is used. svg: '...' }, { // if you specify width, svg will scale proportionally svg: '...', width: 150 }, { // if you specify height, svg will scale proportionally // Minimal pdfmake version: 0.2.23 svg: '...', height: 100 }, { // if you specify both width and height - svg will be stretched svg: '...', width: 600, height: 400 }, { // you can also fit the svg inside a rectangle svg: '...', fit: [150, 100] }, { // if no width/height is specified in SVG element, you must set width and height for node svg: '...', width: 300, height: 200 }, ] };` [Images](https://pdfmake.github.io/docs/0.1/document-definition-object/images/ "Images") [Links](https://pdfmake.github.io/docs/0.1/document-definition-object/links/ "Links") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options QR code ======= `var docDefinition = { content: [ // basic usage { qr: 'text in QR' }, // colored QR { qr: 'text in QR', foreground: 'red', background: 'yellow' }, // resized QR { qr: 'text in QR', fit: '500' }, ] }` Properties: * `qr`: `string` - text in QR code * `foreground`: `string` (optional, default black) - foreground color * `background`: `string` (optional, default white) - background color * `fit`: `integer` (optional) - fit the output QR image * `version`: `integer` (optional) - QR version range from 1 to 40 (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Storage) * `eccLevel`: `string` (optional, default L) - error correction capability (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Error_correction) ), possible values: * _L_ - Level L (Low), approx 7% of codewords can be restored * _M_ - Level M (Medium), approx 15% of codewords can be restored * _Q_ - Level Q (Quartile), approx 25% of codewords can be restored * _H_ - Level H (High), approx 30% of codewords can be restored * `mode`: `string` (optional) - encoding mode, possible values: _numeric_, _alphanumeric, octet_ (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Storage) ) * `mask`: `integer` (optional) - mask pattern, range from 0 to 7 (for details see [wikipedia.org](https://en.wikipedia.org/wiki/QR_code#Encoding) ) [Links](https://pdfmake.github.io/docs/0.1/document-definition-object/links/ "Links") [Table of contents](https://pdfmake.github.io/docs/0.1/document-definition-object/toc/ "Table of contents") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Links ===== To add external or internal links, use the following syntax: `{ text: 'google', link: 'http://google.com' } { text: 'Go to page 2', linkToPage: 2 } { text: 'Go to Header', linkToDestination: 'header' }, { text: 'Header content', id: 'header' },` Or link to local computer file: `var dd = { content: [ { text: 'link', link: 'file:///c:/testFile.txt' } ] };` ##### Properties * `link` (`string`) - URL to external site * `linkToPage` (`number`) - link to page number * `linkToDestination` (`string`) - link to document destination [SVGs](https://pdfmake.github.io/docs/0.1/document-definition-object/svgs/ "SVGs") [QR code](https://pdfmake.github.io/docs/0.1/document-definition-object/qr/ "QR code") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Table of contents ================= The simplest example of a table of contents: `var docDefinition = { content: [ { toc: { title: {text: 'INDEX', style: 'header'} } }, { text: 'This is a header', style: 'header', tocItem: true } ] }` If `id` is used in toc, the tocItem can target that id: `var docDefinition = { content: [ { toc: { id: 'mainToc', title: {text: 'INDEX', style: 'header'} } }, { text: 'This is a header', style: 'header', tocItem: 'mainToc' } ] }` If multiple Table of Contents are used, tocItem can be used to place the text in the correct toc: `var docDefinition = { content: [ { toc: { id: 'mainToc', title: {text: 'INDEX', style: 'header'} }, toc: { id: 'subToc', title: {text: 'SUB INDEX', style: 'header'} } }, { text: 'This is a header', style: 'header', tocItem: ['mainToc', 'subToc'] } ] }` [QR code](https://pdfmake.github.io/docs/0.1/document-definition-object/qr/ "QR code") [Watermark](https://pdfmake.github.io/docs/0.1/document-definition-object/watermark/ "Watermark") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Watermark ========= #### Properties * `text` - watermark text * `color` - color of text * `opacity` opacity of text * `bold` - bold style of text * `italics` - italics style of text * `fontSize` - own font size of text (ideal size is calculated automatically) (**minimal version: 0.1.60**) * `angle` - angle of text rotation (**minimal version: 0.1.60**) #### Examples Example of simple basic usage: `var docDefinition = { watermark: 'test watermark', content: [ '...' ] };` Example of font style: `var docDefinition = { watermark: { text: 'test watermark', color: 'blue', opacity: 0.3, bold: true, italics: false }, content: [ '...' ] };` Example of own font size: Minimal version: **0.1.60** `var docDefinition = { watermark: { text: 'test watermark', fontSize: 20 }, content: [ '...' ] };` Example of watermark rotation angle: Minimal version: **0.1.60** `var docDefinition = { watermark: { text: 'test watermark', angle: 70 }, content: [ '...' ] };` [Table of contents](https://pdfmake.github.io/docs/0.1/document-definition-object/toc/ "Table of contents") [Page dimensions, orientation and margins](https://pdfmake.github.io/docs/0.1/document-definition-object/page/ "Page dimensions, orientation and margins") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Page dimensions, orientation and margins ======================================== `var docDefinition = { // a string or { width: number, height: number } pageSize: 'A5', // by default we use portrait, you can change it to landscape if you wish pageOrientation: 'landscape', // [left, top, right, bottom] or [horizontal, vertical] or just a number for equal margins pageMargins: [ 40, 60, 40, 60 ], };` If you set `pageSize` to a string, you can use one of the following values: * `'4A0'`, `'2A0'`, `'A0'`, `'A1'`, `'A2'`, `'A3'`, `'A4'`, `'A5'`, `'A6'`, `'A7'`, `'A8'`, `'A9'`, `'A10'`, * `'B0'`, `'B1'`, `'B2'`, `'B3'`, `'B4'`, `'B5'`, `'B6'`, `'B7'`, `'B8'`, `'B9'`, `'B10'`, * `'C0'`, `'C1'`, `'C2'`, `'C3'`, `'C4'`, `'C5'`, `'C6'`, `'C7'`, `'C8'`, `'C9'`, `'C10'`, * `'RA0'`, `'RA1'`, `'RA2'`, `'RA3'`, `'RA4'`, * `'SRA0'`, `'SRA1'`, `'SRA2'`, `'SRA3'`, `'SRA4'`, * `'EXECUTIVE'`, `'FOLIO'`, `'LEGAL'`, `'LETTER'`, `'TABLOID'` To change page orientation within a document, add a page break with the new page orientation. `{ pageOrientation: 'portrait', content: [ {text: 'Text on Portrait'}, {text: 'Text on Landscape', pageOrientation: 'landscape', pageBreak: 'before'}, {text: 'Text on Landscape 2', pageOrientation: 'portrait', pageBreak: 'after'}, {text: 'Text on Portrait 2'}, ] }` Automatic page height: `var dd = { pageSize: { width: 595.28, height: 'auto' }, content: [ // ... ] }` #### Dynamically control page breaks, for instance to avoid orphan children A `pageBreakBefore` function can be specified, which can determine if a page break should be inserted before a node. To implement a ‘no orphan child’ rule, use a definition like this: `var dd = { content: [ {text: '1 Headline', headlineLevel: 1}, 'Some long text of variable length ...', {text: '2 Headline', headlineLevel: 1}, 'Some long text of variable length ...', {text: '3 Headline', headlineLevel: 1}, 'Some long text of variable length ...', ], pageBreakBefore: function(currentNode, followingNodesOnPage, nodesOnNextPage, previousNodesOnPage) { return currentNode.headlineLevel === 1 && followingNodesOnPage.length === 0; } }` If `pageBreakBefore` returns true, a page break will be added before the `currentNode`. Current node has the following information attached: `{ id: '', headlineLevel: '', text: '', ul: '', ol: '', table: '', image: '', qr: '', canvas: '', columns: '', style: '', pageOrientation '', pageNumbers: [2, 3], // The pages this element is visible on (e.g. multi-line text could be on more than one page) pages: 6, // the total number of pages of this document stack: false, // if this is an element which encapsulates multiple sub-objects startPosition: { pageNumber: 2, // the page this node starts on pageOrientation: 'landscape', // the orientation of this page left: 60, // the left position right: 60, // the right position verticalRatio: 0.2, // the ratio of space used vertically in this document (excluding margins) horizontalRatio: 0.0 // the ratio of space used horizontally in this document (excluding margins) } }` [Watermark](https://pdfmake.github.io/docs/0.1/document-definition-object/watermark/ "Watermark") [Document Metadata](https://pdfmake.github.io/docs/0.1/document-definition-object/document-medatadata/ "Document Metadata") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Patterns ======== Minimal version: **0.2.3** Patterns can be defined as a dictionary of predefined patterns in the document definition. Only tiling patterns are supported. #### Pattern definition Each pattern is defined using: * `boundingBox` - bounding box used to clip the pattern cell * `xStep` - horizontal spacing between cells * `yStep` - vertical spacing between cells * `pattern` - a PDF stream of operations that render the graphics/text of the cell For more information on each property and patterns in general see the [PDF reference](https://www.adobe.com/content/dam/acom/en/devnet/pdf/pdfs/pdf_reference_archives/PDFReference.pdf) , section 4.6 and 4.6.2 specifically on tiling patterns. #### Pattern definition example Basic pattern that produces a 45° stripe pattern: `var docDefinition = { content: ["..."], patterns: { stripe45d: { boundingBox: [1, 1, 4, 4], xStep: 3, yStep: 3, pattern: "1 w 0 1 m 4 5 l s 2 0 m 5 3 l s", }, }, };` The output can be seen in the vector example. #### Usage in vectors, tables and text The following properties are available. For text: * `background` - set as background for text (see styling\_properties example) For vectors: * `color` - set as fill for a vector (see the rectangle in vector example) For table cells: * `fillColor` - cell (background) fill color * `overlayPattern` - overlay for a cell, painted over the contents * `overlayOpacity` - the opacity of the overlay Each of the above properties is defined as a tuple `[string, string]`. The first element is the key in the patterns dictionary and the second is the color to use to paint the pattern. #### Examples Text: `{ text: 'Insert lorem. And ipsum', background: ['stripe45d', 'gray'] }` Vector: `{ type: 'rect', x: 10, y: 250, w: 50, h: 30, color: ['stripe45d', 'blue'], }` Table (as used in table cells): `{ text: 'Sample value', fillOpacity: 0.85, fillColor: ['stripe45d', 'blue'] }` `{ text: 'Sample value', fillOpacity: 0.15, fillColor: 'blue', overlayPattern: ['stripe45d', 'gray'], overlayOpacity: 0.15 }` [Document Metadata](https://pdfmake.github.io/docs/0.1/document-definition-object/document-medatadata/ "Document Metadata") [Compression](https://pdfmake.github.io/docs/0.1/document-definition-object/compression/ "Compression") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Compression =========== Compression of PDF is enabled by default, use `compress: false` for disable: `var docDefinition = { compress: false, content: (...) };` [Patterns](https://pdfmake.github.io/docs/0.1/document-definition-object/patterns/ "Patterns") [Encryption and access privileges](https://pdfmake.github.io/docs/0.1/document-definition-object/security/ "Encryption and access privileges") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options PDF/A ===== Minimal version: **0.2.15** PDF/A is specialized for use in the archiving and long-term preservation of electronic documents. PDF version 1.4 or above is required. `var docDefinition = { version: '1.5', subset: 'PDF/A-3a', tagged: true, displayTitle: true, info: { title: 'Awesome PDF document from pdfmake' }, content: [ 'PDF/A document for archive' ] };` Supported PDF versions (property `version`): * `1.3` - PDF version 1.3 (default) **not supported PDF/A** * `1.4` - PDF version 1.4 * `1.5` - PDF version 1.5 * `1.6` - PDF version 1.6 * `1.7` - PDF version 1.7 * `1.7ext3` - PDF version 1.7 ExtensionLevel 3 Subset of document (property `subset`): * `PDF/A-1` (shortcut for PDF/A-1b) * `PDF/A-1a` * `PDF/A-1b` * `PDF/A-2` (shortcut for PDF/A-2b) * `PDF/A-2a` * `PDF/A-2b` * `PDF/A-3` (shortcut for PDF/A-3b) * `PDF/A-3a` * `PDF/A-3b` * `PDF/UA` Mark document as Tagged PDF (property `tagged`) * `true` - enable * `false` - disable Display of document title in window title (property `displayTitle`) * `true` - enable * `false` - disable [Encryption and access privileges](https://pdfmake.github.io/docs/0.1/document-definition-object/security/ "Encryption and access privileges") [Options](https://pdfmake.github.io/docs/0.1/options/ "Options") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Encryption and access privileges ================================ Minimal version: **0.1.50** `var docDefinition = { userPassword: '123', ownerPassword: '123456', permissions: { printing: 'highResolution', //'lowResolution' modifying: false, copying: false, annotating: true, fillingForms: true, contentAccessibility: true, documentAssembly: true }, content: [ '...' ] };` PDF document allow you to encrypt the PDF file and require a password when opening the file, and/or set permissions of what users can do with the PDF file. To enable encryption set user password in `userPassword` (string value). The PDF file will be encrypted when a user password is provided, and users will be prompted to enter the password to decrypt the file when opening it. To set access privileges for the PDF file, you need to provide an owner password in `ownerPassword` (string value) and object `permissions` with permissions. By default, all operations are disallowed. You need to explicitly allow certain operations. Following settings are allowed in `permissions` object: * `printing` - whether printing is allowed. Specify `"lowResolution"` to allow degraded printing, or `"highResolution"` to allow printing with high resolution * `modifying` - whether modifying the file is allowed. Specify `true` to allow modifying document content * `copying` - whether copying text or graphics is allowed. Specify `true` to allow copying * `annotating` - whether annotating, form filling is allowed. Specify `true` to allow annotating and form filling * `fillingForms` - whether form filling and signing is allowed. Specify `true` to allow filling in form fields and signing * `contentAccessibility` - whether copying text for accessibility is allowed. Specify `true` to allow copying for accessibility * `documentAssembly` - whether assembling document is allowed. Specify `true` to allow document assembly You can specify either user password, owner password or both passwords. Behavior differs according to passwords you provides: * When only user password is provided, users with user password are able to decrypt the file and have full access to the document. * When only owner password is provided, users are able to decrypt and open the document without providing any password, but the access is limited to those operations explicitly permitted. Users with owner password have full access to the document. * When both passwords are provided, users with user password are able to decrypt the file but only have limited access to the file according to permission settings. Users with owner password have full access to the document. Note that PDF file itself cannot enforce access privileges. When file is decrypted, PDF viewer applications have full access to the file content, and it is up to viewer applications to respect permission settings. To choose encryption method, you need to specify PDF version by `version`. The best possible encryption method for PDF version is used. PDF version is used only for encryption method, all other PDF elements are in version 1.3. Available versions: * `1.3` - PDF version 1.3 (default), 40-bit RC4 is used * `1.4` - PDF version 1.4, 128-bit RC4 is used * `1.5` - PDF version 1.5, 128-bit RC4 is used * `1.6` - PDF version 1.6, 128-bit AES is used * `1.7` - PDF version 1.7, 128-bit AES is used * `1.7ext3` - PDF version 1.7 ExtensionLevel 3, 256-bit AES is used When using PDF version 1.7 ExtensionLevel 3, password is truncated to 127 bytes of its UTF-8 representation. In older versions, password is truncated to 32 bytes, and only Latin-1 characters are allowed. [Compression](https://pdfmake.github.io/docs/0.1/document-definition-object/compression/ "Compression") [PDF/A](https://pdfmake.github.io/docs/0.1/document-definition-object/pdfa/ "PDF/A") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Options ======= Advanced options for creating document used in [client-side methods](https://pdfmake.github.io/docs/0.1/getting-started/client-side/methods/) or [server-side method](https://pdfmake.github.io/docs/0.1/getting-started/server-side/) . Options: `fontLayoutCache` - Minimal version: **0.1.55** * `fontLayoutCache` - option to disable font layout cache (_default_: `true` - cache enabled) * `bufferPages` - allows you to control when pages are flushed to the output file (see [pdfkit documentation](http://pdfkit.org/docs/getting_started.html) ) (_default_: `false` - buffer disabled) [PDF/A](https://pdfmake.github.io/docs/0.1/document-definition-object/pdfa/ "PDF/A") [Getting started](https://pdfmake.github.io/docs/0.1/getting-started/ "Getting started") --- # pdfmake Navigation : Getting started \- Client-side \-- Methods \-- Supported browsers \-- Examples \- Server-side \-- Supported Node.js versions \-- Examples \- Examples from the community Fonts \- Custom fonts (client-side) \-- via Virtual file system (VFS) \-- via URL protocol \- Icons \- Standard 14 fonts Document-definition-object \- Styling \- Columns \- Tables \- Lists \- Headers and footers \- Background-layer \- Margins \- Stack of paragraphs \- Images \- SVGs \- Links \- QR code \- Table of contents \- Watermark \- Page dimensions, orientation and margins \- Document Metadata \- Patterns \- Compression \- Encryption and access privileges \- PDF/A Options Document Metadata ================= PDF documents can have various metadata associated with them, such as the title, or author of the document. You can add that information by adding it to the document definition `var docDefinition = { info: { title: 'awesome Document', author: 'john doe', subject: 'subject of document', keywords: 'keywords for document', }, content: 'This is an sample PDF printed with pdfMake' }` Standard properties: * `title` - the title of the document * `author` - the name of the author * `subject` - the subject of the document * `keywords` - keywords associated with the document * `creator` - the creator of the document (default is ‘pdfmake’) * `producer` - the producer of the document (default is ‘pdfmake’) * `creationDate` - the date the document was created (added automatically by pdfmake) * `modDate` - the date the document was last modified * `trapped` - the trapped flag in a PDF document indicates whether the document has been “trapped”, i.e. corrected for slight color misregistrations Custom properties: You can add custom properties. Key of property not contain spaces. #### Document language PDF document can have custom language set via `language` property. Example: `var docDefinition = { language: 'cs-CZ' content: 'Jednoduchý PDF dokument vytvoření pomocí pdfmake' }` [Page dimensions, orientation and margins](https://pdfmake.github.io/docs/0.1/document-definition-object/page/ "Page dimensions, orientation and margins") [Patterns](https://pdfmake.github.io/docs/0.1/document-definition-object/patterns/ "Patterns") ---