Edit PDF annotations using JavaScript

In addition to an API for creating annotations, we also provide an API for updating those annotations directly on the client. Following the optimistic UI approach, the changes will be instantly visible in the UI, but they aren’t persisted until the annotations are saved.

To update annotations, use Instance#update:

PSPDFKit.load(configuration).then(async (instance) => {
  const annotations = await instance.getAnnotations(0);
  const annotation = annotations.get(0);
  const updatedAnnotation = annotation.set("opacity", 0.5);
  await instance.update(updatedAnnotation);

  console.log("Annotation updated.");
});

Once annotations have been edited, they’ll need to be persisted. This is done by saving them. Save them to external storage or embed them into the document. They can also be exported to XFDF or Instant JSON. If you’re using Web SDK with Document Engine, they can be synced with the backend.