Xfdf export of ArcMesaurement annotation works incorrectly

WebViewer Version:

Do you have an issue with a specific file(s)? no
Can you reproduce using one of our samples or online demos? yes
Are you using the WebViewer server? no
Does the issue only happen on certain browsers? no
Is your issue related to a front-end framework? no
Is your issue related to annotations? yes

Please give a brief summary of your issue: Xfdf export of ArcMesaurement annotation works incorrectly
(Think of this as an email subject)

Please describe your issue and provide steps to reproduce it:

I used latest webViewer demo sample from

  1. download https://docs.apryse.com/downloads/WebViewer.zip and extract to webViewer folder
  2. go to webViever\samples\viewing\viewing\viewing.js
  3. change it as follows:
// @link WebViewerInstance: https://docs.apryse.com/api/web/WebViewerInstance.html
// @link UI.loadDocument: https://docs.apryse.com/api/web/UI.html#loadDocument__anchor

WebViewer(
  {
    path: '../../../lib',
    initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf',
	licenseKey: 'xxx',
  },
  document.getElementById('viewer')
).then(instance => {


  samplesSetup(instance);

  document.getElementById('select').onchange = e => {
    instance.UI.loadDocument(e.target.value);
  };

  document.getElementById('file-picker').onchange = e => {
    const file = e.target.files[0];
    if (file) {
      instance.UI.loadDocument(file);
    }
  };

  document.getElementById('url-form').onsubmit = e => {
    e.preventDefault();
    instance.UI.loadDocument(document.getElementById('url').value);
  };

  const {documentViewer} = instance.Core;

  documentViewer.addEventListener('documentLoaded', () => {
    registerAnnotationListeners(instance);
  });


});

function registerAnnotationListeners(instance) {
  const {annotationManager} = instance.Core;
  annotationManager.addEventListener("annotationChanged", (annotations, action, { imported }) => {
    if (annotations[0] instanceof instance.Core.Annotations.ArcAnnotation) {
      instance.Core.annotationManager.exportAnnotations({
        annotList: annotations,
        widgets: true,
        fields: true,
        links: true,
        useDisplayAuthor: true,
        generateInlineAppearances: true
      }).then( txt => console.log(txt));
    }
  });

}
  1. run ‘npm install’
  2. run ‘npm start’
  3. in browser go to http://localhost:3000/samples/viewing/viewing/
  4. in webViewer drop-down select Measure
  5. select arcAnnotation
  6. add annotation
  7. click away
  8. observer incorrect render in webViewer
  9. go to JS console
  10. copy paste xfdf output into text.xfdf file
  11. try to open in with adobe pdf reader using original pdf file
  12. observe same incorrect render in adobe

Also same behavior observed when using Core.annotationManager.exportAnnotationCommand

1 Like

Hello Oleksii,

We were able to reproduce this arc measurement rendering issue on our end with the provided steps. I have submitted a report about this issue.

Best Regards,
Darian

1 Like

Hello Oleksii,

We think this could be because the tool is triggering the annotation changed event before all of the properties have been set.

Could you try adding a small timeout in the annotationChanged handler before the export is called? I was able to render the annotation correctly like so:

      annotationManager.addEventListener("annotationChanged", async (annotations, action, { imported }) => {
        setTimeout(async () => {
          await annotationManager.exportAnnotations();
        }, 1000);
      });

Best Regards,
Darian

2 Likes

thank you. It works with the suggested change.
However, you may want to change event flow in future release, so annotationChanged event will be triggered after all the properties are set and ready. So it will work as is without mentioned adjustment.

2 Likes

Hello Oleksii,

A fix for this issue has been completed and will be available in our nightly experimental build within the next 24 hours. You will no longer need to add a timeout to export the annotation properly. You can download the latest experimental build at https://dev.apryse.com/nightly/experimental. This build is meant for testing and not recommended for production use. The fix will be included in our next scheduled stable release.

Best Regards,
Darian

1 Like