[]
        
(Showing Draft Content)

Page Structure in PDF

Page Sections

In PdfDocument, each page is divided into three sections: header, body and footer. Each of these sections denotes a drawing area, represented by the PdfPageArea class, with its own methods for drawing text and graphics.


pdf-structure


Drawing areas are not isolated from each other, so the drawings made in one area might affect another one. Each of the drawing areas has its own coordinate system, where (0, 0) coordinate points to the upper-left corner.


The PdfDocument class instance represents the body section itself, while its header and footer properties represent the header and footer sections respectively:

import * as wijmo from '@mescius/wijmo';
import * as wjPdf from '@mescius/wijmo.pdf';

var doc = new wjPdf.PdfDocument();

doc.header.drawText("header");
doc.drawText("body");
doc.footer.drawText("footer");

//To hide footer or header set the area's height property to 0:
var doc = new wjPdf.PdfDocument({
    header: { height: 0 },
    footer: { height: 0 }
});

Page Settings

During initialization, you can define page settings such as layout, size and margins by passing them into PdfDocument's constructor within pageSettings object.


The layout determines the orientation of the page, portrait or landscape.


The size determines the dimensions of the page. Both predefined and custom sizes are supported.


The margins determines the margins of the page.

For example:

var doc = new wjPdf.PdfDocument({
    pageSettings: {
        layout: wjPdf.PdfPageOrientation.Portrait,
        size: wjPdf.PdfPageSize.Letter,
        margins: {
            left: 72,
            top: 72,
            right: 72,
            bottom: 72
        }
    }
});

None of these settings can be changed at run-time for already existing pages.


Use pageSettings property to provide settings for the pages that will be added automatically or by calling addPage method. Use currentPageSettings property to get the current page settings.

doc.addPage(doc.currentPageSettings);