Annotations overview in JavaScript
14 Jan 20261 minute to read
Annotations in PDFViewer are interactive elements that allow users to add notes, highlights, or text boxes directly to a PDF document. These annotations can be used to add context or feedback directly to PDF files, simplifying collaboration during document reviews.
The PDF Viewer component provides a complete set of annotation tools for reviewing, measuring, and marking up PDFs in JavaScript (ES5).
Supported annotations
- Text markup: Highlight, Underline, Squiggly, Strikethrough
- Shapes: Line, pArrow, Rectangle, Circle, Polygon
- Text boxes: Free Text
- Drawing: Ink (freehand)
- Stamps: Standard and custom stamps
- Notes: Sticky Notes (comments)
- Redaction: Mark and apply redactions
- Measurement: Distance, Perimeter, Area, Radius, Volume
Annotation manipulation capabilities
- Create annotations: Use the toolbar, context menu, or APIs to add highlights, notes, shapes, and more directly onto the PDF document.
- Edit annotations: Modify existing annotations by moving, resizing, or updating text and style properties like color, opacity, and thickness.
- Customize annotations: Adjust appearance and behavior—such as fonts, fill colors, and opacity—through the UI or configuration options.
- Undo and redo annotations: Revert or reapply annotation actions (add, edit, delete) using toolbar buttons or corresponding APIs.
- Import and export annotations: Save and load annotations in JSON or XFDF formats to persist markups across sessions or share them with others.
- Set Permissions: Enable or disable annotation permission, ensuring compliance with document permissions.
- Add and manage comments: Insert, edit, and delete comments or sticky notes attached to annotations for clearer feedback and collaboration.