import MeasurementViewModel from "@arcgis/core/widgets/Measurement/MeasurementViewModel.js";const MeasurementViewModel = await $arcgis.import("@arcgis/core/widgets/Measurement/MeasurementViewModel.js");- Inheritance:
- MeasurementViewModel→
Accessor
- Since
- ArcGIS Maps SDK for JavaScript 4.13
Provides the logic for the Measurement widget.
Constructors
Constructor
Parameters
| Parameter | Type | Description | Required |
|---|---|---|---|
| properties | | |
Properties
| Property | Type | Class |
|---|---|---|
| | ||
activeViewModel readonly | | |
| | ||
declaredClass readonly inherited | ||
| | ||
state readonly | | |
| |
activeTool
- Type
- MeasurementComponentType | null | undefined
Specifies the current measurement tool to display. Setting its value to area activates
the area measurement tool and it works for both MapView and
SceneView. To measure distance in a MapView
set the property to distance and in a SceneView set it to direct-line.
If this property is not set, the widget will not be displayed.
Example
// To create the Measurement widget with SceneView's linear measurement widget active.let measurement = new Measurement({ viewModel: { view: view, activeTool: "direct-line" }}); activeViewModel
- Type
- ActiveMeasurementViewModel | null | undefined
View model of the active measurement widget.
Example
// Print the active view model to the console.let measurement = new Measurement({ viewModel: { areaUnit: "square-us-feet", view: view, activeTool: "area" }});console.log("Active ViewModel: ", measurement.viewModel.activeViewModel); areaUnit
- Type
- SystemOrAreaUnit
Unit system (imperial, metric) or specific unit used for displaying the area values.
Possible values are: metric, imperial, square-inches, square-feet, square-us-feet, square-yards, square-miles, square-nautical-miles, square-meters, square-kilometers, acres, ares, hectares.
Example
// To create the Measurement widget that displays area in square US feetlet measurement = new Measurement({ viewModel: { areaUnit: "square-us-feet", view: view, activeTool: "area" }});
// To display the current measurement unit for areaconsole.log("Current unit: ", measurement.viewModel.areaUnit); linearUnit
- Type
- SystemOrLengthUnit
Unit system (imperial, metric) or specific unit used for displaying the distance values.
Possible values are: metric, imperial, inches, feet, us-feet, yards, miles, nautical-miles, meters, kilometers.
Example
// To create the Measurement widget that displays distance in yardslet measurement = new Measurement({ viewModel: { linearUnit: "yards", view: view, activeTool: "distance" }});
// To display the current measurement unit for distanceconsole.log('Current unit: ', measurement.viewModel.linearUnit); state
- Type
- MeasurementState
The ViewModel's state.
| Value | Description |
|---|---|
| disabled | not ready yet |
| ready | ready for measuring |
| measuring | measuring has started |
| measured | measuring has finished |
- Default value
- "disabled"
Example
// To display the state of the AreaMeasurement2D widgetlet measurement = new Measurement({ view: view, activeTool: "area"});reactiveUtils.watch( () => measurement.viewModel.state, (state) => console.log("Current state: ", state)); view
- Type
- MapViewOrSceneView | null | undefined
Example
// Add the measurement widget to the upper right hand corner.const measurement = new Measurement({ viewModel: { view: view, activeTool = "distance"; }});view.ui.add(measurement, "top-right");