Redaction Annotations

Redaction annotations are annotations that mark areas of the PDF for redaction. They can exist as a text selection or rectangle to redact text or an area of a page respectively. Redaction occurs in two steps: creating the redaction and applying the redaction. The redaction application button will only appear when the full API is enabled.

Redaction annotations support both fill and stroke colors. They appear as empty rectangles with a border by default until you hover over them. Then the fill color and overlay text will appear, giving a preview of the redaction result.

WebViewer(...)
  .then(instance => {
    const { documentViewer, annotationManager, Annotations } = instance.Core;

    let debounce = null;

    // Automatically create redaction annotations on text selection
    documentViewer.addEventListener('textSelected', (quads, text, pageNumber) => {
      // Add some debouncing to prevent constant triggering during selection
      if (debounce) {
        clearTimeout(debounce);
      }
      debounce = setTimeout(() => {
        // Create annotation with object initializer
        const annot = new Annotations.RedactionAnnotation({
          PageNumber: pageNumber,
          Quads: quads,
          StrokeColor: new Annotations.Color(255, 0, 0, 1),
          IsText: true, // Create either a text or rectangular redaction
        });

        // Set annotation preview text to appear in the Redaction Panel
        annot.setCustomData('trn-annot-preview', text);
        annot.Author = annotationManager.getCurrentUser();

        annotationManager.addAnnotation(annot);
        annotationManager.redrawAnnotation(annot);

        debounce = null;
      }, 1000);
    });
  });

Element name: redact

<redact page="0" rect="50,692,100,742" color="#FF0000" flags="print" name="80e33e9b-8ecd-82e7-e4dc-a67ac0281877" subject="Redact" date="D:20220727150859-07'00'" interior-color="#000000" width="1.5" creationdate="D:20220727150859-07'00'">
  <trn-custom-data bytes="{"trn-annot-no-move":"false"}"/>
  <defaultappearance>1 0 0 RG /Helvetica 18 Tf</defaultappearance>
</redact>

Gets or sets the page number of a document that the annotation appears on.

Gets of sets the text quads of the annotation. Since text annotations can span multiple lines of text, the lines of text are represented with an array of quads.

If the redaction is rectangular, only the first quad will be used.

Gets or sets whether the redaction will be treated as a text redaction or rectangular area redaction. If this is not provided, then the annotation will try to make an assumption based on the number of quads provided.

For the full list of properties, please visit the annotation's API docs.

Text to show after redaction has been applied. You can see a preview when hovering over the annotation.

Gets or sets the size of the overlay text. It accepts a string and defaults to 18pt.

The horizontal alignment of the annotation's text.

Values:

• left
• center
• right
• justify

This affects the redaction text.

The color of the redaction overlay text. The default is red.

Gets or sets the color of the annotation's stroke.

Gets or sets the color of the annotation's interior.

Gets or sets the color shown when mouse is not hovering over the annotation.

Gets or sets the width of the annotation's stroke outline.

Gets or sets whether the cursor is hovering over the annotation.

The author of the annotation.

Gets or sets the annotation's stroke color.

Gets or sets whether the annotation is hidden.

Gets or sets whether the annotation is invisible, only if it is an unknown annotation type. Generally for hiding annotations you should use "Hidden".

Gets or sets whether the annotation should be listed in annotation lists. If set to false, the annotation will also become unselectable.

Gets or sets whether the annotation is locked or not. If it's locked it can't be edited or deleted, but the note can be edited.

Gets or sets whether the annotation contents are locked or not. If the contents are locked then note can't be edited but the annotation can be edited or deleted.

Gets or sets if this annotation can be deleted.

Gets or sets whether the annotation is visible on the screen. Differs from Hidden in that it can still be printed if the print flag is set.

Gets or sets the opacity of the annotation.

Gets or sets whether the annotation should be displayed when printing the page.

Gets or sets whether the annotation is readonly or not. If it's readonly both the annotation itself and its note can't be edited or deleted.

Gets or sets whether the ToggleNoView flag is set on the annotation.

Although it is possible to get the quads using the Quads property, there is also a getQuads method on the annotation to get its quads.

console.log(redaction.getQuads());
[
   { // First quad of the first line
      "x1":58.24,
      "y1":98.97,
      "x2":265.13,
      "y2":98.97,
      "x3":265.13,
      "y3":87.47,
      "x4":58.25,
      "y4":87.47
   },
   ... // Second quad of the second line and so on
]

Using the setQuads API can be used to set the quads for the annotation as well.

WebViewer(...)
  .then(instance => {
    const { annotationManager, Annotations } = instance.Core;

    annotationManager.addEventListener('annotationChanged', (annotations, action) => {
      if (annotations.length > 0 && action === 'add') {
        annotations.forEach(annot => {
          if (annot instanceof Annotations.RedactionAnnotation) {
            const quads = annot.getQuads();
            quads.forEach(quad => {
              quad.x1 = Math.round(quad.x1 * 100) / 100;
              quad.y1 = Math.round(quad.y1 * 100) / 100;
            });
            annot.setQuads(quads);
          }
        });
      }
    });
  });

Applying redactions are not done through the annotation but through the applyRedactions API on the AnnotationManager. You can provide a subset of redactions to apply to avoid redacting all redactions before they are ready.