ngpdfv1.0.1

Project

Limitations and roadmap

What ngpdf does not do yet, from fonts and links to tables and images, and what is planned next for @ngpdf/core.

ngpdf covers documents built from text, tables, boxes, images, shapes and SVG. This page lists what it does not do yet, and what is planned next.

Limits

Text and fonts

  • In the standard PDF fonts (Helvetica, Times and Courier), only WinAnsi characters: any other is drawn as ?, with a warning in development mode. Custom fonts have no such limit.
  • No font collections (.ttc), no color emoji fonts (emoji can be drawn as images), and no kerning across two fonts in one line.
  • A bare number is in points, except in line-height, where it multiplies the font size as in CSS (line-height: 1.4). Write line-height: 14pt for points.
  • Bare text inside an element other than pdf-text (<pdf-cell>{{ x }}</pdf-cell>) is laid out as an anonymous pdf-text with its parent's text styles.
  • No right-to-left text. Automatic hyphenation needs a hyphenation function from your app: ngpdf ships no patterns. Justified text widens only the gaps between words, never the space between letters.

Layout and styling

  • Colors are hex (3, 4, 6 or 8 digits), rgb()/rgba(), the CSS named colors and transparent. Other forms, such as hsl(), throw.
  • Children and images of a rounded view are clipped to its corners only with an overflow other than visible.
  • Backgrounds are a color and one linear-gradient() or radial-gradient(). No background images, no repeating-* or conic-gradient(), no explicit radial sizes and no color hints.
  • A box cannot fill the remaining height of a page. Use a fixed height.
  • transform takes 2D rotations, scales and translations only: no skew(), matrix() or 3D functions.
  • position is static, relative or absolute: no fixed, sticky or z-index. An absolute element is never split across sheets, and against the page its bottom is measured on the whole content, not on one sheet.
  • display is flex or none only: no block, inline, grid or contents.
  • Your own components inside a document are transparent, like display: contents. Styles on a component's host element are ignored with a warning. Style a pdf-* element inside it instead. The same goes for the document component you render.
  • Links open http:, https: and mailto: URLs, or jump to an anchor in the same document. There are no links to a page number or to another PDF.
  • A link or bookmark jumps to the top left of the element's first piece, at the zoom the reader has. An anchor on an element that is not drawn as a box of its own, such as a pdf-text inside a pdf-text, is never placed, so links and bookmarks to it are left out.
  • A link's clickable area is an upright rectangle: inside a transform it covers the transformed area's bounding box, and an overflow clip does not cut it.

Notes

  • A pdf-note holds plain text only and can't go inside a pdf-text: notes anchored to a run of text, such as a highlight with a comment, are not supported yet.
  • The viewer decides how the icon and popup look; ngpdf sets only the icon name, its color and whether the popup starts open.
  • A note's icon is not moved away from a link it overlaps. ngpdf writes notes before links, and viewers draw later annotations on top, so the link takes the click in the overlap.

Tables

  • Inside a pdf-table, horizontal padding, borders and margins on a row are ignored. Put horizontal padding on the pdf-cells.
  • A table header row is not repeated on a page whose first row fits only without it and can't split. It warns in development mode.
  • A split table row draws every cell from the top of each piece: align-items, align-self and the space justify-content adds above a cell's content are ignored. A split row pdf-view keeps its children's places on the first piece only.

Pagination

  • A unit taller than a page (a table row or row pdf-view that can't split, or a pdf-view in a column) is clipped to its page. So is a pdf-text that stays one unit: one inside a row that stays whole, or one with break-inside: avoid, a fixed height or max-height, a transform, or fewer than orphans + widows lines. A transformed unit is cut in its own coordinates, before the transform, so the cut turns with it. A straight border line across the cut is drawn only down to it; a rounded border side across it can still reach up to half its width below. Other text breaks between lines instead.

Images

  • PNG and JPEG only. SVG is drawn by pdf-svg instead.
  • Images fetched from a URL have no size limit unless you set maxImageBytes.

SVG

  • pdf-svg draws a subset of SVG: no text, image, clipPath, mask, filter, pattern, marker, <style> sheets or animation, and gradients are drawn with spreadMethod="pad" only. Each part left out warns in development mode. See SVG.
  • No inline SVG elements in a template (<pdf-svg><pdf-path d="…"/></pdf-svg>): the drawing comes from src.

Preview

  • pdf-viewer shows the PDF with the browser's own PDF viewer. Chrome on Android shows no PDF inside a page, and Safari on iOS shows only the first page. See Where the preview works for a download fallback.

Server rendering

  • renderToBuffer needs a Node version Angular 22 supports, and nothing in the document may need a DOM. See Server rendering.
  • renderToBuffer reads image and font URLs only through fetchImage. renderToBlob and PdfRenderer.toBlob still fetch them directly on the server, so use renderToBuffer there.

Out of scope

  • Forms.
  • Capturing the DOM of a page as a PDF.

Planned

These items are in the roadmap. Items that change behaviour go through a design update first, so details may change.

Layout

  • Fill the remaining page height.

Images

  • Cancelling the other image downloads when one fails.

Ideas and bug reports are welcome on GitHub issues.