Fonts in PDF

Standard fonts

Out of the box PdfDocument supports the following fonts:

• Courier
• Helvetica
• Times
• Symbol
• ZapfDingbats

The first three fonts have four typefaces each,"normal", "bold", "oblique" and "bold oblique". This gives us a set of fonts known as "14 Standard PDF fonts".

Setting up the font

The PdfFont class describes a particular font and its constructor accepts the following arguments:

• Font family: A font family name or a prioritized list of font family names separated by a comma, including general font family names like "monospace", "serif" etc. PdfDocument will use the closest registered font. For example, "times", "Roboto, serif". The standard fonts are represented by the following values: "courier", "helvetica", "times", "symbol", "zapfdingbats".
• Font size
• Font style*: One of the following values: "normal", "italic", "oblique".
• Font weight: One of the following values: "normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900".

The following instance is the default document font in terms of PdfDocument:

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

new wjPdf.PdfFont("times", 10, "normal", "normal");

Using the font in PdfDocument, the font can be specified in two ways:

Using drawText Method

The drawText method accepts an options? object, and the PdfFont instance can be passed through this oject via the font property.

doc.drawText("Lorem", null, null, {
    font: new wjPdf.PdfFont("times", 10, "normal", "bold")
});

Using setFont method

You can also cahnge the default document font using the setFont method. This must be done before drawing text to the document using drawText method. This approach is useful when a lot of text with the same font is needed to be drawn.

doc.setFont(new wjPdf.PdfFont("times", 10, "normal", "bold"));
doc.drawText("Lorem");

If font with exact given style and weight properties is not found, then the closest registered font will be used.

This sample shows how to use drawText and setFont methods to draw text using different fonts.

Embedding a Custom Font

Along with use of the standard fonts, PdfDocument also provides the ability to embed custom fonts into document. The following font formats are supported:

• .ttf
• .ttc
• .dfont

First, a custom font must be registered using the registerFont or registerFontAsync method. This method loads font from a URL and associates it with a specified font family name and font attributes (like the style, weight, whether it is a serif or sans serif font, etc). After that the font family name can be used in association with PdfFont class just like any other standard font.

In the example below, the Fira font family is used and two fonts, FiraSans-Regular.ttf and FiraSans-Bold.ttf, are embedded into the document.

Example:

doc.registerFont({
    source: "resources/fonts/fira/FiraSans-Regular.ttf",
    name: "fira",
    style: "normal",
    weight: "normal",
    sansSerif: true
});

doc.drawText("Here is the FiraSans-Regular font.", null, null, {
    // an equivalent of font: new wjPdf.PdfFont("fira", 10, "normal", "normal")
    font: new wjPdf.PdfFont("fira")
});