Rotate an ink annotation

Ink signatures have no rotation concept in the PDF specification, so there’s no rotation property on PSPDFKit.Annotations#InkAnnotation.

However, you can still rotate an annotation by mapping and rotating the annotation points individually and adjusting the bounding box if needed.

This example provides a function that can rotate an ink annotation from the center of its bounding box using square angles (90, 180, and 270 degrees):

function rotateInkAnnotation(annotation, degrees) {
  // Get the annotation's geometric center.
  const annotationCenter = new PSPDFKit.Geometry.Point({
    x: annotation.boundingBox.left + annotation.boundingBox.width / 2,
    y: annotation.boundingBox.top + annotation.boundingBox.height / 2
  });


  let rotatedAnnotation = annotation.update("lines", (lines) =>
    lines.map((line) =>
      line.map((point) =>
        // Rotate each annotation point.
        point
          .translate(annotationCenter.scale(-1))
          .rotate(degrees)
          .translate(annotationCenter)
      )
    )
  );


  // For 90 and 270 degrees, the bounding box needs to be rotated too.
  if (degrees === 90 || degrees === 270) {
    rotatedAnnotation = rotatedAnnotation.set(
      "boundingBox",
      new PSPDFKit.Geometry.Rect({
        left: annotationCenter.x - annotation.boundingBox.height / 2,
        top: annotationCenter.y - annotation.boundingBox.width / 2,
        width: annotation.boundingBox.height,
        height: annotation.boundingBox.width
      })
    );
  }


  return rotatedAnnotation;
}


// Rotate the annotation by 90 degrees and update it:
instance.update(rotateInkAnnotation(inkAnnotation, 90));

This has been tested with Nutrient Web SDK 2020.5.0.