HowTo set Default widget for ArcGIS Maps SDK for JavaScript 4

[RichardDaniels]

I'm creating a new ArcGIS Maps SDK for JavaScript 4.28 web application and have been going through and adding each needed widget in sequence (and testing). However, after adding the Measurement widget the mouse now defaults to the measure tool. How do I change the mouse 'back' to the default (Arrow) icon used for panning-zooming? I only want the measure tool to be active after the user clicks the Measurement button.

//add the measurement widget

var measurement = new Measurement({

  view: view,

  activeTool: "distance",

  linearUnit: "imperial"

  });

var bgExpand4 = new Expand({

expandIcon: "measure",

view:view,

content: measurement,

label: "Measurement"

  }

     );

view.ui.add(bgExpand4, "top-right");

[Justin_Greco]

You are setting the activeTool when you are initializing the widget, you can either set it to null or just remove it all together.

const measurement = new Measurement({
  view: view,
  linearUnit: "imperial"
});

[RichardDaniels]

My solution was to change the widget to esri/widget/Measurement2D, which does not have the undesired behavior. I still would like to see how to set the activeTool programmatically.

[Justin_Greco]

Have you looked at the sample for the Measurement widget? The Measurement widget really is just a way to wrap the distance and area measurement widgets into one widget.  You do need to build the button UI yourself, the sample there is a distance, area, and clear button.  On the button click event is when you would set the active tool.  The sample is geared toward an app where you can switch between 2D and 3D, since it sounds. like you are just working in 2D, I simplified it below.

Though if you are just looking to have a distance measurement and no area measurement, you're good just using the DistanceMeasurement2D widget.

        distanceButton.addEventListener("click", () => {
          distanceMeasurement();
        });

        function distanceMeasurement() {
          measurement.activeTool = "distance";
          distanceButton.classList.add("active");
          areaButton.classList.remove("active");
        }