Determine annotation types in Apryse WebViewer

There are a number of WebViewer annotation types, including cloud, polygon, free hand, and stamp, among others.

To determine annotation types, programmatically, you may need to review a mix of annotation properties. Most can be distinguished using instanceof to check its object type, but, for those that share the same type, like cloud and polygon which both use the type polygon, you'll need to go one step further and review additional properties.

The following is a list of annotation object types and their properties:

Type	Properties
Arc	annotation instanceof window.Core.Annotations.ArcAnnotation
Arc measurement	annotation instanceof window.Core.Annotations.ArcAnnotation && annotation.IT === 'ArcDimension'
Area	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.IT === "PolygonDimension"
Area measurement	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.IT === 'PolygonDimension' && annotation.Measure
Arrow	annotation instanceof window.Core.Annotations.LineAnnotation && annotation.IT === 'LineArrow'
Callout	annotation instanceof window.Core.Annotations.FreeTextAnnotation && annotation.getIntent() === window.Core.Annotations.FreeTextAnnotation.Intent.FreeTextCallout
Change view	annotation instanceof window.Core.Annotations.StampAnnotation && annotation.ViewState
Check box form field	annotation instanceof window.Core.Annotations.CheckButtonWidgetAnnotation
Cloud	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.Style === 'cloudy'
Cloudy rectangular area measurement	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.IT === 'PolygonDimension' && annotation.Measure && annotation.isRectangularPolygon() && annotation.Style === 'cloudy'
Combo box form field	annotation instanceof window.Core.Annotations.ChoiceWidgetAnnotation
Count measurement	annotation instanceof window.Core.Annotations.StickyAnnotation && annotation.getCustomData('trn-is-count')
Date free text	annotation instanceof window.Core.Annotations.FreeTextAnnotation && ToolName === 'AnnotationCreateDateFreeText'
Distance measurement	annotation instanceof window.Core.Annotations.LineAnnotation && annotation.IT === 'LineDimension' && annotation.Measure
Dot	annotation instanceof window.Core.Annotations.StampAnnotation && annotation.stampText === "Dot"
Ellipse	annotation instanceof window.Core.Annotations.EllipseAnnotation
Ellipse area	annotation instanceof window.Core.Annotations.EllipseAnnotation && annotation.IT === 'EllipseDimension'
Ellipse measurement	annotation instanceof window.Core.Annotations.EllipseAnnotation && annotation.IT === 'EllipseDimension' && annotation.Measure
Free hand	annotation instanceof window.Core.Annotations.FreeHandAnnotation && annotation.ToolName === "AnnotationCreateFreeHand"
Free hand highlight	annotation instanceof window.Core.Annotations.FreeHandAnnotation && annotation.ToolName === "AnnotationCreateFreeHandHighlight"
File attachment	annotation instanceof window.Core.Annotations.FileAttachmentAnnotation
Free text	annotation instanceof window.Core.Annotations.FreeTextAnnotation
Highlight	annotation instanceof window.Core.Annotations.TextHighlightAnnotation && annotation.getCustomData('officeEditorTrackedChangeUID') === ''
Image	annotation instanceof window.Core.Annotations.StampAnnotation && annotation.ToolName === 'AnnotationCreateStamp'
Line	annotation instanceof window.Core.Annotations.LineAnnotation && annotation.IT !== 'LineArrow'
List box form field	annotation instanceof window.Core.Annotations.ListWidgetAnnotation
Mark insert text	annotation instanceof window.Core.Annotations.CaretAnnotation
Mark replace text	annotation instanceof window.Core.Annotations.CaretAnnotation && annotation.IT === 'Replace'
Perimeter measurement	annotation instanceof window.Core.Annotations.PolylineAnnotation && annotation.IT === 'PolyLineDimension' && annotation.Measure
Polygon	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.Style !== 'cloudy'
Polyline	annotation instanceof window.Core.Annotations.PolylineAnnotation
Push button form field	annotation instanceof window.Core.Annotations.PushButtonWidgetAnnotation
Radio button form field	annotation instanceof window.Core.Annotations.RadioButtonWidgetAnnotation
Rectangle	annotation instanceof window.Core.Annotations.RectangleAnnotation
Rectangular area measurement	annotation instanceof window.Core.Annotations.PolygonAnnotation && annotation.IT === 'PolygonDimension' && annotation.Measure && annotation.isRectangularPolygon()
Redaction	annotation instanceof window.Core.Annotations.RedactionAnnotation
Signature	annotation instanceof window.Core.Annotations.SignatureWidgetAnnotation && annotation.Subject === 'Widget'
Signature form field	annotation instanceof window.Core.Annotations.SignatureWidgetAnnotation
Sound	annotation instanceof window.Core.Annotations.SoundAnnotation
Squiggly	annotation instanceof window.Core.Annotations.TextSquigglyAnnotation
Stamp	annotation instanceof window.Core.Annotations.StampAnnotation
Sticky note	annotation instanceof window.Core.Annotations.StickyAnnotation
Strikeout	annotation instanceof window.Core.Annotations.TextStrikeoutAnnotation
Text field	annotation instanceof window.Core.Annotations.TextWidgetAnnotation
3D annotation	annotation instanceof window.Core.Annotations.Model3DAnnotation
Tick	annotation instanceof window.Core.Annotations.StampAnnotation && annotation.stampText === "Accepted"
Tracked change	annotation instanceof window.Core.Annotations.TextHighlightAnnotation && annotation.getCustomData('officeEditorTrackedChangeUID')
Underline	annotation instanceof window.Core.Annotations.TextUnderlineAnnotation

The following sample JavaScript code shows you how to use the properties listed above to determine annotation types in a PDF document.

JavaScript

// Map of annotations with related information and annotationCheck methods for identification
const map = {
	  'rectangle': {
		    icon: 'icon-tool-shape-rectangle',
		    annotationCheck: (annotation) => annotation instanceof window.Core.Annotations.RectangleAnnotation
    },
    // Other annotations...
}

// Method that iterates through the annotation map and calls each annotationCheck function to determine which type matches the annotation. 
// Returns the string key representing the type of the given annotation.
const mapAnnotationToKey = (annotation) => Object.keys(map).find((key) => {
	  const { annotationCheck } = map[key];
	  return annotationCheck(annotation);
});

// Using this to identify an annotation
const annotation = new window.Core.Annotations.RectangleAnnotation();
// ... annotation setup ...
const key = mapAnnotationToKey(annotation);
console.log(key); // Output: 'rectangle'
console.log(map[key].icon); // Output: 'icon-tool-shape-rectangle'