Annotations displayed vertically (rotated 90°) depending on the document

WebViewer Version: 11.3.0

I’m using Apryse in a React app to let users place anotations on PDF documents. The issue I’m facing is that on some documents, the widget annotations (TEXT_FORM_FIELD) appear rotated vertically (90°) instead of being horizontal.

I tried different options but none works for me:

const pageIndex = annotation.PageNumber - 1;
annotation.Rotation = documentViewer.getCompleteRotation(pageIndex) * 90;
annotationManager.addEventListener('annotationChanged', (annotations, action, info) => {
        const tempAnnotation = annotations[0];
        tempAnnotation.NoRotate = true;
        ...
});
documentViewer.addEventListener('documentLoaded', () => {
        console.log(documentViewer.getCompleteRotation(1)) // 3
        documentViewer.setRotation(0)
        console.log(documentViewer.getCompleteRotation(1)) // 3
});

Maybe i can use the fieldManager to help me but idk how. I’m already using it for:

const fieldManager = annotationManager.getFieldManager();
const field = fieldManager.getField(tempAnnotation.fieldName);
field.setValue(`Text to display`);

But I’m not sure this is the right approach for text form field.

1 Like

Hello, I’m AiRon, an automated tech support bot :robot:
While you wait for one of our customer support representatives, I can help you with your question.


It seems like you’re having an issue with widget annotations appearing rotated due to the page rotation settings in your PDF documents. This can indeed be confusing, especially if the document’s rotation is not being reset as expected.

Some things you can try:

  • Ensure that the annotation’s rotation is set according to the document’s rotation. Use annotation.Rotation = documentViewer.getCompleteRotation(pageIndex) * 90; to set the rotation correctly.

  • Check if setting the NoRotate property affects the rendering. If set to true, the annotation should ignore page rotations.

  • Ensure that you’re applying the rotation settings after the document is fully loaded using the documentLoaded event listener.

  • Use the FieldManager to adjust settings for the field if necessary, though it seems your current usage is correct for setting field values.



Here are some resources that might help you:

  • APIs for PDF form filling - This guide details the APIs available for managing fields and annotations, which might help you manage the rotation issue.

  • Styling PDF form fields - This resource explains how to style and manipulate widget DOM elements, which could be useful for custom adjustments.

  • InteractiveForms - Sample code for using Apryse SDK with interactive forms, which could help you better understand form manipulation.

  • Migrating to V11 Form Builder Overview - This guide outlines changes in form handling that might affect your implementation.

  • Migrating to V6 of WebViewer - This includes information on handling widget annotations, which may provide insights into your issue.



Hopefully, this helps you solve your problem while you wait for a human to get back to you.

1 Like

Hi there,

Some documents may have internal rotations applied to the page and may be rotated even if the page is in the correct orientation.

If you use the same API getCompleteRotation on the page, you can see if the page has any rotations applied, i.e.

for (let i=1; i<=documentViewer.getPageCount(); i++) {
    console.log(documentViewer.getCompleteRotation(i))
}

For example, if the page has a rotation of 1 (90 degree rotation), then creating an annotation on top of it has Rotation property of 90.

You can revert this rotation by subtracting the same amount:
I.e.

annotation.Rotation = annotation.Rotation - (documentViewer.getCompleteRotation(pageIndex) * 90);

best regards,
Kevin

1 Like

Hi,
I’ve already tried changing the rotation with annotation.Rotation, but it only changes the position of the annotation, not the “selection rectangle”.

Annotation on a document with correct orientation:

Annotation on a document with wrong orientation:
(using annotation.Rotation = ...)

1 Like

Hi there,

If I apply the rotation on the annotation (free-text), when the page has a rotation of 1, then the annotation will appear rotated as well as the input text:

Are you able to reproduce the same behaviour on our showcase demo?

If not, could you please share a sample input file or a minimal runnable project to reproduce the issue?

Best regards,
Kevin

1 Like