How-To: Change display unit and decimal place of measure operators

HOOPS Communicator
, , ,
1

In this article we’re going to describe changing way of display unit and decimal place of dimension created using measurement operators in the Web Viewer run-time.

Builtin measurement operators such as MeasureEdgeLengthOperator and MeasurePointPointDistanceOperator don’t have APIs for customizing display unit and decimal place.

However, it is possible to change the display style using callback function of Web Viewer API in run time.

1aa109d3-8b4f-4e7c-b375-a09bf17f0503
1aa109d3-8b4f-4e7c-b375-a09bf17f05031011×382 57.3 KB

Instructions

It is possible to rewrite measurement text using the measurementValueSet callback.

The measurementValueSet is called including MeasureMarkup object when the measurement value is set but before it is displayed to the user.

The MeasureMarkup provides APIs which get and set precise value and unit of current dimension.

Here is code snippet

viewer.setCallbacks({
    measurementValueSet:(measureMarkup)=> {
        // Get dimension value and unit
        let value = measureMarkup.getMeasurementValue();
        const unit = measureMarkup.getUnitMultiplier();
        
        // Change value's unit to inch
        switch (unit) {
            // mm => inch
            case 1:
                value /= 25.4;
                break;
            // m => inch
            case 1000:
                value /= 0.0254;
                break;
            default:
                break;
        }
        
        // Make dimension text in 3 decimal place
        const dimText = String(Math.floor(value * 1000) / 1000) + ' in';
        
        // Rewrite dimension text
        measureMarkup.setMeasurementText(dimText);
    }
});

measurementValueSet is common callback for all measure operators. You can know active measure operator using MeasureMarkup.getName() or getClassName() method.

i.e.) getName returns “MeasureStraightEdgeLength” when MeasureEdgeLengthOperator is running.