Rendering to pixels
Produce raster output from the SDK without an on-screen canvas — page thumbnails via the Viewer, or full RGBA/PNG rasters via ViewerSession and Inspector.
Render pages to pixels — for thumbnails, page rails, and headless output.
In short three paths produce rasters. Viewer.renderPageThumbnail(index, { width }) is the easy one for page rails. For full control, ViewerSession
renders a page to tightly-packed RGBA8 at a target width or DPI, and the
read-only Inspector.renderPage(index, dpi) returns PNG bytes without any canvas
at all — ideal for tests and tooling.
Thumbnails (the easy path)
const raster = await viewer.renderPageThumbnail(0, { width: 240 });
// raster: { width, height, rgba: Uint8Array } — draw into an ImageData / canvasFull rasters, headless
// RGBA at a target width, from the session:
const png = await session.render_page_to_bytes(0, 1600);
// Or PNG bytes from the read-only inspector (no canvas, no camera):
const inspector = new Inspector(idmlBytes);
const pngBytes = inspector.renderPage(0, 144); // 144 dpiSessionRaster/RenderedRaster are { width, height, rgba } — write the rgba
into an ImageData and putImageData, or encode to PNG yourself. The
Inspector path already returns encoded PNG.
Members
| Member | Signature | Description |
|---|---|---|
| Viewer.renderPageThumbnail | renderPageThumbnail(index: number, opts?: { width?: number }): Promise<SessionRaster> | Render one page to an off-screen RGBA raster at a target width — for page rails and thumbnails. |
Frequently asked questions
Thumbnail vs. session render — which should I use?
renderPageThumbnail for UI rails (it reuses the viewer's device). The session's
render_page_to_bytes/render_to_bytes when you need a specific DPI or are
rendering outside a viewer.
Can I render without a visible canvas?
Yes — the Inspector.renderPage(index, dpi) path needs no canvas and returns PNG
bytes, which is what the test corpus uses.
Is the output color-managed? The raster is the renderer's RGBA output. Color handling follows the engine; see the renderer for what the pipeline does with color.
Events & errors
Subscribe to the SDK viewer's events with viewer.on(...), and branch on typed ViewerError codes rather than message strings.
ViewerSession (low-level)
The wasm session that createViewer wraps — load, set page, present a camera, render to a canvas or to bytes. Use it directly only when you need raw control.