Edit this page

kendo.pdf

Helper functions declared in the kendo.pdf namespace.

Methods

defineFont

Defines a map with locations for TrueType Font (.ttf) files. It is safe to call this method multiple times.

The exportPDF method will use the font files when embedding them in a PDF document. Since Kendo UI 2014 Q3 SP1, the Kendo UI PDF generator is able to dig CSS @font-face declarations directly from the stylesheets. "Manually" calling the pdf.defineFont()method is no longer necessary. For more information how to embed fonts using CSS at-rules - check this section. This will work only if the style sheet and fonts are loaded from the same domain.

Fonts must be loaded from the same origin or CORS-enabled.

Parameters

map Object

A map for font names, variants and the location of its .ttf file.

  • The key is the font name. Optional variants are separated with a pipe symbol.
  • The value is the TrueType Font (.ttf) file URL.

Example - Define font locations for embedding

<script>
    // Import DejaVu Sans font for embedding
    kendo.pdf.defineFont({
        "DejaVu Sans":
             "http://cdn.kendostatic.com/2017.3.1018/styles/fonts/DejaVu/DejaVuSans.ttf",

        "DejaVu Sans|Bold":
            "http://cdn.kendostatic.com/2017.3.1018/styles/fonts/DejaVu/DejaVuSans-Bold.ttf",

        "DejaVu Sans|Bold|Italic":
             "http://cdn.kendostatic.com/2017.3.1018/styles/fonts/DejaVu/DejaVuSans-Oblique.ttf",

        "DejaVu Sans|Italic":
             "http://cdn.kendostatic.com/2017.3.1018/styles/fonts/DejaVu/DejaVuSans-Oblique.ttf"
    });
</script>

<script>
    var draw = kendo.drawing;
    var geom = kendo.geometry;

    var text = new draw.Text(
        "Lorem ípsum dolor sit amét, pro éu facilis vulputáte témporibus.",
        [20, 20], {
            font: "14px 'DejaVu Sans', Arial, sans-serif"
        });

    var root = new draw.Group();
    root.append(text);

    draw.exportPDF(root, { paperSize: "A5", landscape: true }).done(function(data) {
        kendo.saveAs({
            dataURI: data,
            fileName: "dejavu.pdf"
        });
    });
</script>

See Also

Other articles on Kendo UI Drawing API:

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy