Render page to image without annotations

Q: How can I render a page as an image URL without annotations?

A: You can easily do so by hiding or removing the annotations on the page, and then calling either Instance#renderPageAsImageURL() or Instance#renderPageAsArrayBuffer().

The following snippet uses a helper function to hide the annotations in the specified page, render it, and show the annotations again:

async function renderPageWithoutAnnotations(pageIndex, width) {
  // Get page annotations
  const annotations = await instance.getAnnotations(pageIndex);
  // Hide page annotations
  await instance.update( => annotation.set("noView", true))
  // Render the page
  const imageURL = await instance.renderPageAsImageURL({ width }, pageIndex);
  // Show the annotations again
  await instance.update( => annotation.set("noView", false))
  // Return the rendered page image URL
  return imageURL;

// Usage example
// Render page without annotations, and width of 500px
// And append it to the body of the document
const imageURL = await renderPageWithoutAnnotations(0, 500);
const img = document.createElement("img");
img.src = imageURL; = "absolute"; = "0";

This has been tested with PSPDFKit for Web 2020.5.0