Measure while drawing


Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

A 2D measurement widget is not part of the ArcGIS 4.9 API for JavaScript. It will be added in a future release. In the current version of the API, you can implement your own 2D measuring tools using draw class and geometryEngine. The DirectLineMeasurement3D widget and the AreaMeasurement3D widget can be used for measurements in 3D.

This sample demonstrates how to draw a Polygon, using PolygonDrawAction, and measure its area in the process of drawing. To start drawing and measuring, click the button located just below the zoom controls.

To draw a polygon using the Draw class, call draw.create("polygon"). This method will return a reference to an instance of the PolygonDrawAction. Listen to the events on this object to implement custom measuring logic for the polygon as it is being drawn.

// draw polygon button
document.getElementById("draw-polygon").addEventListener("click", function () {;
  // create() will return a reference to an instance of PolygonDrawAction
  var action = draw.create("polygon");

  // focus the view to activate keyboard shortcuts for drawing polygons

  // listen polygonDrawAction events to give immediate visual feedback
  // to users as the polygon is being drawn on the view.
  action.on("vertex-add", drawPolygon);
  action.on("cursor-update", drawPolygon);
  action.on("vertex-remove", drawPolygon);
  action.on("redo", drawPolygon);
  action.on("undo", drawPolygon);
  action.on("draw-complete", drawPolygon);

Sample search results