[]
Exporting PDF pages to images is useful for generating previews, thumbnails, or converting document content for image‑based workflows. DsPdfJS allows you to export individual pages of a PDF document as raster or vector images.
Page export is performed using methods of the PdfPage class. DsPdfJS supports exporting pages to PNG (raster) and SVG (vector) formats.
You can export a page of a PDF document to an image using methods of the PdfPage class.
To export a PDF page:
Load the PDF document using the PdfDocument.load method.
Access the page from the document’s pages collection.
Call one of the page export methods.
The PdfPage class provides several export methods:
saveAsPng – exports the page as PNG image data.
saveAsPngImage – exports the page as an Image object.
saveAsSvg – exports the page as SVG data.
saveAsSvgDocument – exports the page as an SvgDocument.
saveAsSvgGz – exports the page as compressed SVG data.
The following code example shows how to export a PDF page to PNG and SVG.
// load doc
const doc = PdfDocument.load(await Util.loadFile("Wetlands.pdf"));
// export page to PNG
const png = doc.pages.getAt(0).saveAsPng();
Util.saveFile("Wetlands_page0.png", png);
// export page to SVG
const svggz = doc.pages.getAt(0).saveAsSvgGz();
Util.saveFile("Wetlands_page0.svggz", png);To export multiple pages from a document, iterate through the document’s pages collection and export each page individually.
Because browser environments do not provide direct access to the file system, exported images can be packaged into a ZIP archive before downloading.
The following code example shows how to export selected pages of a PDF document to PNG images and save them in a ZIP archive.
// load doc
const doc = PdfDocument.load(await Util.loadFile("Wetlands.pdf"));
const zip = new JSZip();
for (let pageNumber = 1; pageNumber <= doc.pages.count; pageNumber++) {
// export odd pages only
if ((pageNumber % 2) !== 0) {
const page = doc.pages.getAt(pageNumber - 1);
const pngBytes = page.saveAsPng({ zoom: 2 });
zip.file(`page${pageNumber}.png`, pngBytes, { binary: true });
}
}
const zipBytes = await zip.generateAsync({ type: "uint8array" });
Util.saveFile("ExportAllPages.zip", zipBytes);