Freeform rotation for PDF annotations

Line, Polygon, Polyline, Freehand, Ellipse, Rectangle, Stamp, FreeText annotations show a rotation control when selected. This control handle lets the user rotate the annotation with a full range (360 degrees).

Rotating annotations programmatically

To rotate annotations programmatically, supported annotations have a rotate function that takes an angle to rotate by:

JavaScript

const { annotationManager, Annotations } = instance.Core;
annotationManager.getAnnotationsList().forEach((annotation) => {
  if (annotation instanceof Annotations.RectangleAnnotation) {
    annotation.rotate(45);
  }
});

Disabling freeform rotation

By default, freeform rotation is enabled for all Line, Polyline, Polygon or Freehand annotations. In order to disable it, the following can be done:

JavaScript (SDK v8.0+)

const annotManager = instance.Core.annotationManager;
annotManager.setRotationOptions({
  isEnabled: false,
});

AnnotationManager.setRotationOptions

JavaScript (SDK v7.0+)

const { annotManager } = instance;
annotManager.setFreeformRotationEnabled(false);

Using the setRotationOptions API, then you can disable rotation completely. If you would like to disable free form rotation on certain annotations, then the following can be used instead:

JavaScript (SDK v8.0+)

Webviewer(...)
  .then(instance => {
    const { annotationManager } = instance.Core;

    annotationManager.addEventListener('annotationChanged', (annotations, action) => {
      if (action === 'add') {
        annotations.forEach((annotation) => {
          annotation.disableRotationControl();
        });
      }
    });
  });

Annotation.disableRotationControl

JavaScript (SDK v7.0+)

Webviewer(...)
  .then(instance => {
    const { annotManager } = instance;

    annotManager.on('annotationChanged', (annotations, action) => {
      if (action === 'add') {
        annotations.forEach((annotation) => {
          annotation.setRotationControlEnabled(false);
        });
      }
    });
  });

Vice-versa, to enable rotation controls, you would use the enableRotationControl API.

Configuring freeform rotation options

If you would like to configure the rotation type and rotation step sizes, that can be done with the same setRotationOptions API.

JavaScript

const annotManager = instance.Core.annotationManager;
annotManager.setRotationOptions({
  isEnabled: true,
  defaultRotationType: Core.AnnotationManager.RotationTypes.SNAP_ROTATION,
  hotkeyTogglesRotationType: false,
  snapAngleStepSizeInDegrees: 60,
});