ArcGIS for Developers

View layers toggle

This widget demonstrates how to create a dropdown toggle to allow viewing different layers on the map.

How to use the sample

Clone the sample repo and copy this widget's folder (within samples/widgets) to the client/your-extensions/widgets folder of your Experience Builder installation.

How it works

Within widget.tsx, in the render() function, the layers are added to the dropdown <select>:

{ => {
  return <option value={url}>{url}</option>;

The onChange handler is setup to call the selectChangeHandler() function when the selected value changes.

A reference to the Map object is acquired using the JimuMapViewComponent module, and that reference is used in the selectChangeHandler() function to add the selected layer to the map:

// Create and add the new Feature Layer
const featureLayer = new FeatureLayer({