--- title: "Measure distance in a PDF using JavaScript | Nutrient Web SDK" canonical_url: "https://www.nutrient.io/guides/web/measurements/measure-distance/" md_url: "https://www.nutrient.io/guides/web/measurements/measure-distance.md" last_updated: "2026-05-30T02:20:01.405Z" description: "Learn how to measure distance in a PDF using JavaScript with Nutrient Web SDK. Measure between two points or multiple connected points programmatically or through the built-in user interface (UI)." --- # Measure distance in a PDF using JavaScript Measure distance in a PDF using Nutrient Web SDK starting with version 2022.5. To measure distance in your app, [contact the Sales team](https://www.nutrient.io/contact-sales) to add the Measurement Tools component to your license, or run the SDK in trial mode. Measure distance in one of the following ways: - [Measure the distance between two points](#measuring-distance-between-two-points) - [Measure the distance between multiple connected points](#measuring-distance-between-multiple-connected-points) ## Measuring distance between two points Measure the distance between two points in one of the following ways: - [Using the built-in user interface (UI)](#measuring-distance-between-two-points-using-the-built-in-ui) - [Programmatically](#measuring-distance-between-two-points-programmatically) ### Measuring distance between two points using the built-in UI To measure the distance between two points using the built-in UI, follow the steps below: 1. Click the measurement tools icon in the toolbar. 2. Tap **Distance**. 3. Draw a straight line between the two points you want to measure. ### Measuring distance between two points programmatically To measure the distance between two points programmatically, use the [`LineAnnotation` shape constructor](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.LineAnnotation.html), which takes a [`measurementScale` property](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.ShapeAnnotation.html#measurementscale) and a [`measurementPrecision` property](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.ShapeAnnotation.html#measurementprecision) as its parameters, as demonstrated in the code snippet below: ```js let pspdfkitInstance; // Global or module-level variable. NutrientViewer.load({...baseOptions, toolbarItems: [...NutrientViewer.defaultToolbarItems, { type: "cloudy-rectangle", dropdownGroup: "shapes" }, { type: "dashed-rectangle", dropdownGroup: "shapes" }, { type: "cloudy-ellipse", dropdownGroup: "shapes" }, { type: "dashed-ellipse", dropdownGroup: "shapes" }, { type: "dashed-polygon", dropdownGroup: "shapes" }, { type: "content-editor", dropdownGroup: "editor" }, { type: "form-creator", dropdownGroup: "editor" }, { type: "measure", dropdownGroup: "editor" }, { type: "document-comparison", dropdownGroup: "editor" }, ], measurementValueConfiguration: (documentScales) => { const customScale = { name: "myCustomScale", scale: { unitFrom: NutrientViewer.MeasurementScaleUnitFrom.POINTS, // Using the enum value. unitTo: NutrientViewer.MeasurementScaleUnitTo.CENTIMETERS, // Using the enum value. fromValue: 1, toValue: 0.05, // 1 pt = 0.05 cm }, precision: NutrientViewer.MeasurementPrecision.TWO, // Using the enum value selected: true, // Make this the default scale. }; return [customScale,...documentScales]; }, }).then(async (instance) => { try { // Create measurement annotation. const lineAnnotation = new NutrientViewer.Annotations.LineAnnotation({ strokeColor: NutrientViewer.Color.RED, pageIndex: 0, startPoint: new NutrientViewer.Geometry.Point({ x: 100, y: 100 }), endPoint: new NutrientViewer.Geometry.Point({ x: 300, y: 300 }), boundingBox: new NutrientViewer.Geometry.Rect({ left: 100, top: 100, width: 200, height: 200, }), measurementPrecision: "threeDp", measurementScale: { unitFrom: "in", unitTo: "in", fromValue: 1, toValue: 1, }, lineCaps: { start: "butt", end: "butt" }, }); // Add the annotation to the document. await instance.create(lineAnnotation); console.log("Measurement annotation created and added to the document."); console.log((await instance.getAnnotations(0)).toJS()); } catch (error) { console.error("Error creating or adding annotation:", error); } }).catch(function (error) { console.error("Error loading PDF:", error.message); }); ``` You can try the code snippet above in our [playground](https://www.nutrient.io/demo/sandbox?p=eyJqcyI6ImxldCBwc3BkZmtpdEluc3RhbmNlOyAvLyBHbG9iYWwgb3IgbW9kdWxlLWxldmVsIHZhcmlhYmxlXG5QU1BERktpdC5sb2FkKHtcbiAgLi4uYmFzZU9wdGlvbnMsXG4gIHRvb2xiYXJJdGVtczogW1xuICAgIC4uLlBTUERGS2l0LmRlZmF1bHRUb29sYmFySXRlbXMsXG4gICAgeyB0eXBlOiBcImNsb3VkeS1yZWN0YW5nbGVcIiwgZHJvcGRvd25Hcm91cDogXCJzaGFwZXNcIiB9LFxuICAgIHsgdHlwZTogXCJkYXNoZWQtcmVjdGFuZ2xlXCIsIGRyb3Bkb3duR3JvdXA6IFwic2hhcGVzXCIgfSxcbiAgICB7IHR5cGU6IFwiY2xvdWR5LWVsbGlwc2VcIiwgZHJvcGRvd25Hcm91cDogXCJzaGFwZXNcIiB9LFxuICAgIHsgdHlwZTogXCJkYXNoZWQtZWxsaXBzZVwiLCBkcm9wZG93bkdyb3VwOiBcInNoYXBlc1wiIH0sXG4gICAgeyB0eXBlOiBcImRhc2hlZC1wb2x5Z29uXCIsIGRyb3Bkb3duR3JvdXA6IFwic2hhcGVzXCIgfSxcbiAgICB7IHR5cGU6IFwiY29udGVudC1lZGl0b3JcIiwgZHJvcGRvd25Hcm91cDogXCJlZGl0b3JcIiB9LFxuICAgIHsgdHlwZTogXCJmb3JtLWNyZWF0b3JcIiwgZHJvcGRvd25Hcm91cDogXCJlZGl0b3JcIiB9LFxuICAgIHsgdHlwZTogXCJtZWFzdXJlXCIsIGRyb3Bkb3duR3JvdXA6IFwiZWRpdG9yXCIgfSxcbiAgICB7IHR5cGU6IFwiZG9jdW1lbnQtY29tcGFyaXNvblwiLCBkcm9wZG93bkdyb3VwOiBcImVkaXRvclwiIH0sXG4gIF0sXG4gIG1lYXN1cmVtZW50VmFsdWVDb25maWd1cmF0aW9uOiAoZG9jdW1lbnRTY2FsZXMpID0%2BIHtcbiAgICBjb25zdCBjdXN0b21TY2FsZSA9IHtcbiAgICAgIG5hbWU6IFwibXlDdXN0b21TY2FsZVwiLFxuICAgICAgc2NhbGU6IHtcbiAgICAgICAgdW5pdEZyb206IFBTUERGS2l0Lk1lYXN1cmVtZW50U2NhbGVVbml0RnJvbS5QT0lOVFMsIC8vIFVzaW5nIHRoZSBlbnVtIHZhbHVlXG4gICAgICAgIHVuaXRUbzogUFNQREZLaXQuTWVhc3VyZW1lbnRTY2FsZVVuaXRUby5DRU5USU1FVEVSUywgLy8gVXNpbmcgdGhlIGVudW0gdmFsdWVcbiAgICAgICAgZnJvbVZhbHVlOiAxLFxuICAgICAgICB0b1ZhbHVlOiAwLjA1LCAvLyAxIHB0ID0gMC4wNSBjbVxuICAgICAgfSxcbiAgICAgIHByZWNpc2lvbjogUFNQREZLaXQuTWVhc3VyZW1lbnRQcmVjaXNpb24uVFdPLCAvLyBVc2luZyB0aGUgZW51bSB2YWx1ZVxuICAgICAgc2VsZWN0ZWQ6IHRydWUsIC8vIE1ha2UgdGhpcyB0aGUgZGVmYXVsdCBzY2FsZVxuICAgIH07XG4gICAgcmV0dXJuIFtjdXN0b21TY2FsZSwgLi4uZG9jdW1lbnRTY2FsZXNdO1xuICB9LFxufSlcbiAgLnRoZW4oYXN5bmMgKGluc3RhbmNlKSA9PiB7XG4gICAgdHJ5IHtcbiAgICAgIC8vIENyZWF0ZSBtZWFzdXJlbWVudCBhbm5vdGF0aW9uXG4gICAgICBjb25zdCBsaW5lQW5ub3RhdGlvbiA9IG5ldyBQU1BERktpdC5Bbm5vdGF0aW9ucy5MaW5lQW5ub3RhdGlvbih7XG4gICAgICAgIHN0cm9rZUNvbG9yOiBQU1BERktpdC5Db2xvci5SRUQsXG4gICAgICAgIHBhZ2VJbmRleDogMCxcbiAgICAgICAgc3RhcnRQb2ludDogbmV3IFBTUERGS2l0Lkdlb21ldHJ5LlBvaW50KHsgeDogMTAwLCB5OiAxMDAgfSksXG4gICAgICAgIGVuZFBvaW50OiBuZXcgUFNQREZLaXQuR2VvbWV0cnkuUG9pbnQoeyB4OiAzMDAsIHk6IDMwMCB9KSxcbiAgICAgICAgYm91bmRpbmdCb3g6IG5ldyBQU1BERktpdC5HZW9tZXRyeS5SZWN0KHtcbiAgICAgICAgICBsZWZ0OiAxMDAsXG4gICAgICAgICAgdG9wOiAxMDAsXG4gICAgICAgICAgd2lkdGg6IDIwMCxcbiAgICAgICAgICBoZWlnaHQ6IDIwMCxcbiAgICAgICAgfSksXG4gICAgICAgIG1lYXN1cmVtZW50UHJlY2lzaW9uOiBcInRocmVlRHBcIixcbiAgICAgICAgbWVhc3VyZW1lbnRTY2FsZToge1xuICAgICAgICAgIHVuaXRGcm9tOiBcImluXCIsXG4gICAgICAgICAgdW5pdFRvOiBcImluXCIsXG4gICAgICAgICAgZnJvbVZhbHVlOiAxLFxuICAgICAgICAgIHRvVmFsdWU6IDEsXG4gICAgICAgIH0sXG4gICAgICAgIGxpbmVDYXBzOiB7IHN0YXJ0OiBcImJ1dHRcIiwgZW5kOiBcImJ1dHRcIiB9LFxuICAgICAgfSk7XG5cbiAgICAgIC8vIEFkZCB0aGUgYW5ub3RhdGlvbiB0byB0aGUgZG9jdW1lbnRcbiAgICAgIGF3YWl0IGluc3RhbmNlLmNyZWF0ZShsaW5lQW5ub3RhdGlvbik7XG4gICAgICBjb25zb2xlLmxvZyhcIk1lYXN1cmVtZW50IGFubm90YXRpb24gY3JlYXRlZCBhbmQgYWRkZWQgdG8gdGhlIGRvY3VtZW50LlwiKTtcblxuICAgICAgY29uc29sZS5sb2coKGF3YWl0IGluc3RhbmNlLmdldEFubm90YXRpb25zKDApKS50b0pTKCkpO1xuICAgIH0gY2F0Y2ggKGVycm9yKSB7XG4gICAgICBjb25zb2xlLmVycm9yKFwiRXJyb3IgY3JlYXRpbmcgb3IgYWRkaW5nIGFubm90YXRpb246XCIsIGVycm9yKTtcbiAgICB9XG4gIH0pXG4gIC5jYXRjaChmdW5jdGlvbiAoZXJyb3IpIHtcbiAgICBjb25zb2xlLmVycm9yKFwiRXJyb3IgbG9hZGluZyBQREY6XCIsIGVycm9yLm1lc3NhZ2UpO1xuICB9KTtcbiIsImNzcyI6Ii8qIEFkZCB5b3VyIENTUyBoZXJlICovXG4iLCJzZXR0aW5ncyI6eyJmaWxlTmFtZSI6ImJhc2ljLnBkZiIsInVzZUR5bmFtaWNGb250cyI6dHJ1ZSwiY3VzdG9tRm9udEZpbGVOYW1lcyI6W119LCJ2IjoxfQ%3D%3D). For more information on scale and precision, refer to the [guide on configuring measurements](https://www.nutrient.io/guides/web/measurements/configure-measurements.md). ## Measuring distance between multiple connected points Measure the distance between multiple connected points in one of the following ways: - [Using the built-in user interface (UI)](#measuring-distance-between-multiple-connected-points-using-the-built-in-ui) - [Programmatically](#measuring-distance-between-multiple-connected-points-programmatically) ### Measuring distance between multiple connected points using the built-in UI To measure the distance between multiple connected points using the built-in UI, follow the steps below: 1. Click the measurement tools icon in the toolbar. 2. Tap **Perimeter**. 3. Draw lines between the multiple points you want to measure. ### Measuring distance between multiple connected points programmatically To measure the distance between multiple connected points programmatically, use the [`PolylineAnnotation` shape constructor](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.PolylineAnnotation.html), which takes a [`measurementScale` property](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.ShapeAnnotation.html#measurementscale) and a [`measurementPrecision` property](https://www.nutrient.io/api/web/classes/NutrientViewer.Annotations.ShapeAnnotation.html#measurementprecision) as its parameters, as demonstrated in the code snippet below: ```js let pspdfkitInstance; // Global or module-level variable. NutrientViewer.load({...baseOptions, theme: NutrientViewer.Theme.DARK, toolbarItems: [...NutrientViewer.defaultToolbarItems, { type: "cloudy-rectangle", dropdownGroup: "shapes" }, { type: "dashed-rectangle", dropdownGroup: "shapes" }, { type: "cloudy-ellipse", dropdownGroup: "shapes" }, { type: "dashed-ellipse", dropdownGroup: "shapes" }, { type: "dashed-polygon", dropdownGroup: "shapes" }, { type: "content-editor", dropdownGroup: "editor" }, { type: "form-creator", dropdownGroup: "editor" }, { type: "measure", dropdownGroup: "editor" }, { type: "document-comparison", dropdownGroup: "editor" }, ], measurementValueConfiguration: (documentScales) => { const customDistanceScale = { name: "myCustomDistanceScale", scale: { unitFrom: "pt", // Simple string for points. unitTo: "cm", // Simple string for centimeters. fromValue: 1, toValue: 0.05, }, precision: "2", // Simple string for precision. selected: true, }; return [customDistanceScale,...documentScales]; }, }).then(async (instance) => { console.log("Nutrient loaded!"); try { // Define the points for the polyline (forming a zigzag). const points = NutrientViewer.Immutable.List([ new NutrientViewer.Geometry.Point({ x: 100, y: 100 }), new NutrientViewer.Geometry.Point({ x: 200, y: 150 }), new NutrientViewer.Geometry.Point({ x: 150, y: 200 }), new NutrientViewer.Geometry.Point({ x: 250, y: 250 }), ]); // Calculate the bounding box (approximate). const minX = 100; const minY = 100; const maxX = 250; const maxY = 250; const boundingBox = new NutrientViewer.Geometry.Rect({ left: minX, top: minY, width: maxX - minX, height: maxY - minY, }); // Create the polyline annotation for distance measurement. const polylineAnnotation = new NutrientViewer.Annotations.PolylineAnnotation({ strokeColor: NutrientViewer.Color.GREEN, pageIndex: 0, points: points, strokeWidth: 3, boundingBox: boundingBox, measurementPrecision: "twoDp", // Using string format. measurementScale: { unitFrom: "pt", // Simple string for points. unitTo: "cm", // Simple string for centimeters. fromValue: 1, toValue: 0.05, // Linear conversion. }, isMeasurement: true, // Mark it as a measurement. }); // Add the annotation to the document. await instance.create(polylineAnnotation); console.log("Polyline distance measurement annotation created and added."); console.log((await instance.getAnnotations(0)).toJS()); } catch (error) { console.error("Error creating or adding polyline measurement annotation:", error); } }).catch(function (error) { console.error("Error loading PDF:", error.message); }); ``` You can try the code above snippet in our [playground](https://www.nutrient.io/demo/sandbox?p=eyJ2IjoxLCJjc3MiOiIvKiBBZGQgeW91ciBDU1MgaGVyZSAqL1xuXHQiLCJzZXR0aW5ncyI6eyJmaWxlTmFtZSI6ImJhc2ljLnBkZiJ9LCJqcyI6ImxldCBwc3BkZmtpdEluc3RhbmNlOyAvLyBHbG9iYWwgb3IgbW9kdWxlLWxldmVsIHZhcmlhYmxlXG5QU1BERktpdC5sb2FkKHtcbiAgLi4uYmFzZU9wdGlvbnMsXG4gIHRoZW1lOiBQU1BERktpdC5UaGVtZS5EQVJLLFxuICB0b29sYmFySXRlbXM6IFtcbiAgICAuLi5QU1BERktpdC5kZWZhdWx0VG9vbGJhckl0ZW1zLFxuICAgIHsgdHlwZTogXCJjbG91ZHktcmVjdGFuZ2xlXCIsIGRyb3Bkb3duR3JvdXA6IFwic2hhcGVzXCIgfSxcbiAgICB7IHR5cGU6IFwiZGFzaGVkLXJlY3RhbmdsZVwiLCBkcm9wZG93bkdyb3VwOiBcInNoYXBlc1wiIH0sXG4gICAgeyB0eXBlOiBcImNsb3VkeS1lbGxpcHNlXCIsIGRyb3Bkb3duR3JvdXA6IFwic2hhcGVzXCIgfSxcbiAgICB7IHR5cGU6IFwiZGFzaGVkLWVsbGlwc2VcIiwgZHJvcGRvd25Hcm91cDogXCJzaGFwZXNcIiB9LFxuICAgIHsgdHlwZTogXCJkYXNoZWQtcG9seWdvblwiLCBkcm9wZG93bkdyb3VwOiBcInNoYXBlc1wiIH0sXG4gICAgeyB0eXBlOiBcImNvbnRlbnQtZWRpdG9yXCIsIGRyb3Bkb3duR3JvdXA6IFwiZWRpdG9yXCIgfSxcbiAgICB7IHR5cGU6IFwiZm9ybS1jcmVhdG9yXCIsIGRyb3Bkb3duR3JvdXA6IFwiZWRpdG9yXCIgfSxcbiAgICB7IHR5cGU6IFwibWVhc3VyZVwiLCBkcm9wZG93bkdyb3VwOiBcImVkaXRvclwiIH0sXG4gICAgeyB0eXBlOiBcImRvY3VtZW50LWNvbXBhcmlzb25cIiwgZHJvcGRvd25Hcm91cDogXCJlZGl0b3JcIiB9LFxuICBdLFxuICBtZWFzdXJlbWVudFZhbHVlQ29uZmlndXJhdGlvbjogKGRvY3VtZW50U2NhbGVzKSA9PiB7XG4gICAgY29uc3QgY3VzdG9tRGlzdGFuY2VTY2FsZSA9IHtcbiAgICAgIG5hbWU6IFwibXlDdXN0b21EaXN0YW5jZVNjYWxlXCIsXG4gICAgICBzY2FsZToge1xuICAgICAgICB1bml0RnJvbTogXCJwdFwiLCAvLyBTaW1wbGUgc3RyaW5nIGZvciBwb2ludHNcbiAgICAgICAgdW5pdFRvOiBcImNtXCIsICAgLy8gU2ltcGxlIHN0cmluZyBmb3IgY2VudGltZXRlcnNcbiAgICAgICAgZnJvbVZhbHVlOiAxLFxuICAgICAgICB0b1ZhbHVlOiAwLjA1LFxuICAgICAgfSxcbiAgICAgIHByZWNpc2lvbjogXCIyXCIsIC8vIFNpbXBsZSBzdHJpbmcgZm9yIHByZWNpc2lvblxuICAgICAgc2VsZWN0ZWQ6IHRydWUsXG4gICAgfTtcbiAgICByZXR1cm4gW2N1c3RvbURpc3RhbmNlU2NhbGUsIC4uLmRvY3VtZW50U2NhbGVzXTtcbiAgfSxcbn0pXG4gIC50aGVuKGFzeW5jIChpbnN0YW5jZSkgPT4ge1xuICAgIGNvbnNvbGUubG9nKFwiTnV0cmllbnQgbG9hZGVkIVwiKTtcbiAgICB0cnkge1xuICAgICAgLy8gRGVmaW5lIHRoZSBwb2ludHMgZm9yIHRoZSBwb2x5bGluZSAoZm9ybWluZyBhIHppZ3phZylcbiAgICAgIGNvbnN0IHBvaW50cyA9IFBTUERGS2l0LkltbXV0YWJsZS5MaXN0KFtcbiAgICAgICAgbmV3IFBTUERGS2l0Lkdlb21ldHJ5LlBvaW50KHsgeDogMTAwLCB5OiAxMDAgfSksXG4gICAgICAgIG5ldyBQU1BERktpdC5HZW9tZXRyeS5Qb2ludCh7IHg6IDIwMCwgeTogMTUwIH0pLFxuICAgICAgICBuZXcgUFNQREZLaXQuR2VvbWV0cnkuUG9pbnQoeyB4OiAxNTAsIHk6IDIwMCB9KSxcbiAgICAgICAgbmV3IFBTUERGS2l0Lkdlb21ldHJ5LlBvaW50KHsgeDogMjUwLCB5OiAyNTAgfSksXG4gICAgICBdKTtcblxuICAgICAgLy8gQ2FsY3VsYXRlIHRoZSBib3VuZGluZyBib3ggKGFwcHJveGltYXRlKVxuICAgICAgY29uc3QgbWluWCA9IDEwMDtcbiAgICAgIGNvbnN0IG1pblkgPSAxMDA7XG4gICAgICBjb25zdCBtYXhYID0gMjUwO1xuICAgICAgY29uc3QgbWF4WSA9IDI1MDtcbiAgICAgIGNvbnN0IGJvdW5kaW5nQm94ID0gbmV3IFBTUERGS2l0Lkdlb21ldHJ5LlJlY3Qoe1xuICAgICAgICBsZWZ0OiBtaW5YLFxuICAgICAgICB0b3A6IG1pblksXG4gICAgICAgIHdpZHRoOiBtYXhYIC0gbWluWCxcbiAgICAgICAgaGVpZ2h0OiBtYXhZIC0gbWluWSxcbiAgICAgIH0pO1xuXG4gICAgICAvLyBDcmVhdGUgdGhlIHBvbHlsaW5lIGFubm90YXRpb24gZm9yIGRpc3RhbmNlIG1lYXN1cmVtZW50XG4gICAgICBjb25zdCBwb2x5bGluZUFubm90YXRpb24gPSBuZXcgUFNQREZLaXQuQW5ub3RhdGlvbnMuUG9seWxpbmVBbm5vdGF0aW9uKHtcbiAgICAgICAgc3Ryb2tlQ29sb3I6IFBTUERGS2l0LkNvbG9yLkdSRUVOLFxuICAgICAgICBwYWdlSW5kZXg6IDAsXG4gICAgICAgIHBvaW50czogcG9pbnRzLFxuICAgICAgICBzdHJva2VXaWR0aDogMyxcbiAgICAgICAgYm91bmRpbmdCb3g6IGJvdW5kaW5nQm94LFxuICAgICAgICBtZWFzdXJlbWVudFByZWNpc2lvbjogXCJ0d29EcFwiLCAvLyBVc2luZyBzdHJpbmcgZm9ybWF0XG4gICAgICAgIG1lYXN1cmVtZW50U2NhbGU6IHtcbiAgICAgICAgICB1bml0RnJvbTogXCJwdFwiLCAvLyBTaW1wbGUgc3RyaW5nIGZvciBwb2ludHNcbiAgICAgICAgICB1bml0VG86IFwiY21cIiwgICAvLyBTaW1wbGUgc3RyaW5nIGZvciBjZW50aW1ldGVyc1xuICAgICAgICAgIGZyb21WYWx1ZTogMSxcbiAgICAgICAgICB0b1ZhbHVlOiAwLjA1LCAvLyBMaW5lYXIgY29udmVyc2lvblxuICAgICAgICB9LFxuICAgICAgICBpc01lYXN1cmVtZW50OiB0cnVlLCAvLyBFeHBsaWNpdGx5IG1hcmsgaXQgYXMgYSBtZWFzdXJlbWVudFxuICAgICAgfSk7XG5cbiAgICAgIC8vIEFkZCB0aGUgYW5ub3RhdGlvbiB0byB0aGUgZG9jdW1lbnRcbiAgICAgIGF3YWl0IGluc3RhbmNlLmNyZWF0ZShwb2x5bGluZUFubm90YXRpb24pO1xuICAgICAgY29uc29sZS5sb2coXCJQb2x5bGluZSBkaXN0YW5jZSBtZWFzdXJlbWVudCBhbm5vdGF0aW9uIGNyZWF0ZWQgYW5kIGFkZGVkLlwiKTtcbiAgICAgIGNvbnNvbGUubG9nKChhd2FpdCBpbnN0YW5jZS5nZXRBbm5vdGF0aW9ucygwKSkudG9KUygpKTtcbiAgICB9IGNhdGNoIChlcnJvcikge1xuICAgICAgY29uc29sZS5lcnJvcihcIkVycm9yIGNyZWF0aW5nIG9yIGFkZGluZyBwb2x5bGluZSBtZWFzdXJlbWVudCBhbm5vdGF0aW9uOlwiLCBlcnJvcik7XG4gICAgfVxuICB9KVxuICAuY2F0Y2goZnVuY3Rpb24gKGVycm9yKSB7XG4gICAgY29uc29sZS5lcnJvcihcIkVycm9yIGxvYWRpbmcgUERGOlwiLCBlcnJvci5tZXNzYWdlKTtcbiAgfSk7In0%253D). For more information on scale and precision, refer to the [guide on configuring measurements](https://www.nutrient.io/guides/web/measurements/configure-measurements.md). ## Configuring measurements For more information on configuring measurements, refer to the [guide on configuring measurements](https://www.nutrient.io/guides/web/measurements/configure-measurements.md). --- ## Related pages - [Measure distance and area in a PDF using JavaScript](/guides/web/measurements.md) - [Configure measurements in a PDF using JavaScript](/guides/web/measurements/configure-measurements.md) - [Measure area in a PDF using JavaScript](/guides/web/measurements/measure-area.md)