How to bind 'area' field from measurmentOverlay to custom textbox/label

Technical Support
1

we need to bind ‘area’ field from measurmentOverlay to custom text-box/label through which, when we start drawing any annotation we can get value increasing at runtime(not after annotation drawn)

2

Hi,

Thanks for contacting us regarding PDFJs Express!

One thing to note is that only annotations with the Measure property are measurement annotations, and have the area calculated by Express.

To get the area when you are still creating annotations, you can listen to the mouseMove event on the docViewer instance. Inside the callback you can check if the current tool is an instance of AreaMeasurementCreateTool or RectangularAreaMeasurementTool. After that you would want to check if the annotation object exists on the tool instance. If it is truthy, then it means the user is currently drawing an annotation. And finally you need to call annotation.getContents to get the area.

You can find a detailed example in this link https://github.com/PDFTron/webviewer-ui/blob/6.3/src/components/MeasurementOverlay/MeasurementOverlay.js#L97-L105.

Thanks,
Zhijie