chevron_right
close
chevron_right

Get Started

chevron_right

Learn more

chevron_right

Open a document

chevron_right

Viewer

chevron_right

UI Customization

chevron_right

Annotations

chevron_right

Collaboration

chevron_right

Forms

chevron_right

Signature

chevron_right

Measurement

Create measurement annotations

Create measurement annotations with the UI

To create measurement annotations in PDF.js Express Web Viewer, click on the measurement tool icon, select one of the tools. Next click and drag on the document to create a measurement annotation. An overlay with measurement information will show up when you are creating or selecting a measurement annotation.

Creating Measurement Annotations

Get scale and precision programmatically

The following example shows how you can determine if an annotation is a measurement annotation and logs the precision and scale of it after it's added:

WebViewer(...)
  .then(function(instance) {
    var docViewer = instance.docViewer;
    var annotManager = instance.annotManager;

    annotManager.on('annotationChanged', function(e, annotations, action) {
      if (action === 'add') {
        var measurementAnnotations = annotations.filter(function(annotation) {
          // An annotation is an measurement annotation if it contains a Measure property
          return annotation.Measure;
        });

        measurementAnnotations.forEach(function(annotation) {
          console.log(annotation.Scale);
          console.log(annotation.Precision);
        });
      }
    });
  });