Custom set of annotations

I’d like to create shortcut buttons within the WebViewer that allows inserting multiple annotations at once.

For example, on selection, it would insert:

  • Free text (with predefined copy)
  • A Cloud Rectangle
  • An arrow positioned between the two

What would be the recommended way to achieve this functionality?

Ideally, users would be able to define and save their own custom sets of annotations, and this list would be managed and persisted outside of the viewer.

We’ve made something similar for producing our own modal within the WebViewer to apply a set of stamps that are managed outside of the WebViewer.

The only way I could think to do this would be:

  1. Create a set of custom annotations (not user defined, hard-coded)

  2. Export/import the XFDF within an editor view, then map the exported XFDF to a button which opens a modal and shows the library of options. Applying this to a PDF will be challenging because we’d need to mutate the page in the XFDF, and the coordinates wouldn’t apply in the way you’d likely expect (and you wouldn’t be able to select/drop the group).

Is there a more robust way that this can be achieved? Perhaps by instead of exporting the XFDF, we export the annotations by type and relative proximity and map that to a builder which creates custom annotation from that?

For the curious, we’re in the process of moving forward with option #2, wherein we programmitcally reassign the “name” attribute of each annotation, and swap out the “page”, “date” and “creationdate” on insert.

The main thing that we’re working around now is that the annotations insert with the coordinates they were originally captured with. We’re grouping them and selecting them programmatically, but that doesn’t help when the viewer is zoomed in and panned somewhere else.

If anyone has recommendations on how to map an imported annotation to the centre of the current viewport, that would be super helpful!

Hello @corey,

Theoretically this can be achieved with our APIs.

At a high level, we can do the following:

If only part of the page is being rendered (zoomed in), we can import the annotations and set x and y to the center of the current viewport by getting the current viewport using the getViewportRegionRect(pageNumber) API, found here: Apryse WebViewer Class: DocumentViewer

From there, you would need to convert the rect to coordinates to set the annotations to, this can be done using the getPDFCoordinates() API, found here: Apryse WebViewer Class: Document

If the entire page is being rendered, we can default to pasting annotations in the center of the page, using getPageWidth() and getPageHeight() APIs, found here:

Let me know if you need further clarification!

Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.