Formatting of scales when applying programmatically

Technical Support WebViewer
, , ,
1

WebViewer Version: 11.3.0

Do you have an issue with a specific file(s)? No
Can you reproduce using one of our samples or online demos? Yes, if needed
Are you using the WebViewer server? No
Does the issue only happen on certain browsers? No
Is your issue related to a front-end framework? No
Is your issue related to annotations? Yes

Please give a brief summary of your issue:
I currently use createAndApplyScale to provide a list of 1-click presets from a dropdown in my own UI. These are all fractional scales but the API appears to only handle decimal scales (such that 1/8"-1ā€™ becomes 0.125 in - 1.000 ft in the built-in scale dialog. Is there a way to call this API such that the formatting is fractional like when selecting a fractional preset in the built-in dialog?

Please describe your issue and provide steps to reproduce it:
(The more descriptive your answer, the faster we are able to help you)
Use the createAndApplyScale API to try to create a nicely formatted 1/8"-1ā€™ scale for any given measurement tool.

Please provide a link to a minimal sample where the issue is reproducible:

1 Like
2

Hello, Iā€™m AiRon, an automated tech support bot :robot:
While you wait for one of our customer support representatives, I can help you with your question.


When using the createAndApplyScale API in WebViewer to set measurement scales, you may notice that the API defaults to decimal formatting rather than fractional formatting. This is because the API is designed to handle numerical values in decimal format for precision and consistency. However, you can format the display of the scale in your UI to show fractional values.

Some things you can try:

  • Use the API to set the scale using decimal values and then implement a custom UI component that converts these decimals back into fractional representations for display purposes.

  • Create a function that maps decimal values to their corresponding fractional representations and use this function to update the UI elements that display the scale.

  • Ensure that any user inputs or selections are converted to decimals before applying them with the API, while maintaining the fractional format for display.



Here are some resources that might help you:


Hopefully, this helps you solve your problem while you wait for a human to get back to you.

1 Like
3

Hello @shaan,

Thank you for posting on our forum.

Currently, our Scale Selector will automatically display the fractional scales in fractions if the value matches with one of our default conversions. For example, if you call the following code:

const distanceMeasurementTool = documentViewer.getTool(instance.Core.Tools.ToolNames.DISTANCE_MEASUREMENT);

const measurementManager = documentViewer.getMeasurementManager();
    measurementManager.createAndApplyScale({
      scale: new Core.Scale([[3 / 32, 'in'], [1, 'ft-in']]),
      applyTo: [distanceMeasurementTool],
    });

It will display:

image
image1468Ɨ1010 122 KB

The total list of the accepted fractions are the following:

[1 / 8, 1 / 16, 1 / 32, 1 / 64]

You can see how the selector functions under the hood by checking out our public UI repo here: https://github.com/XodoDocs/webviewer/blob/master/src/ui/src/components/ScaleOverlay/ScaleSelector.js#L147-L154

Let us know if you need further clarification!

Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.

1 Like