PDF annotation overlay mismatch when exporting from Apryse WebViewer into mobile video workflow

Technical Support WebViewer
, , , ,
1

Hi everyone,

I’m working on a mobile workflow where we generate annotated PDFs using Apryse WebViewer and then repurpose those visual states into short explainer videos with free video editor for mac.

Setup:

  • Apryse WebViewer (web + embedded in mobile WebView via Capacitor)

  • Users annotate PDFs (highlights, text notes, stamps)

  • We capture the annotated state as images/frames

  • Then import those frames into capcut for assembling short tutorial videos

The issue I’m seeing:
When exporting the annotated pages (either via snapshot or programmatic render), the output doesn’t always match what users see inside WebViewer.

Specifically:

  • Text annotations shift slightly in position after export

  • Some highlight layers appear offset or scaled differently

  • Stamps/icons sometimes render sharper or blurrier compared to the live view

This becomes a problem downstream because in capcut:

  • The mismatch becomes very visible in frame-by-frame transitions

  • We end up manually correcting alignment for each exported frame

What I’ve tried so far:

  • Ensuring consistent DPI settings during export

  • Forcing fixed zoom level before capture

  • Using WebViewer’s built-in export APIs instead of manual screenshot capture

Still, the exported visuals don’t fully match the in-app rendering state.

My questions:

  • Is there a recommended way to ensure pixel-perfect consistency between WebViewer UI and exported render output?

  • Could this be related to WebView scaling differences in mobile environments (Capacitor)?

  • Has anyone here used Apryse outputs in downstream media workflows (like video editing tools such as capcut)?

Any guidance on achieving consistent rendering across live view → export → video pipeline would be really helpful.

Thanks in advance.

3

One thing I’d check is whether the annotation rendering pipeline is using the exact same viewport and devicePixelRatio values during both display and export. I’ve seen cases where the live WebViewer canvas looks correct, but exported renders end up with slight coordinate drift because the export process is calculated against a different scale factor.

Since you’re running inside a Capacitor WebView, it may also be worth comparing behavior across devices with different screen densities. Even small scaling differences can become very noticeable once the frames are stitched together into a video sequence.

For the downstream workflow, we ran into something similar when preparing assets for a capcut download and editing pipeline. The annotations looked fine individually, but frame-to-frame transitions exposed tiny alignment inconsistencies that weren’t obvious during normal viewing.

Have you tried exporting the XFDF data and reapplying it to a server-side render of the PDF? That might help determine whether the issue is in annotation positioning itself or in the client-side rendering/export process.