Map widget

The Map widget allows you to display 2D and 3D geographic information. You can enable tools in the map, such as Zoom, Locate, Search, and Measure.

Examples

Use this widget to support app design requirements such as the following:

  • You need to show the comparison of a map in 2D and 3D. You can add two Map widgets and create a trigger and action to synchronize views when interacting with either map.
  • You want to click a feature on the map and display the record in a Feature Info widget.
  • You have a requirement to filter a List widget based on clicking a feature on the map.

Usage notes

You can show a single map or include the option to switch between two maps. You can include multiple maps in an app by adding more Map widgets.

The Map widget requires a data source, including web maps and web scenes. When you include tools, they are automatically positioned on the map based on the size of the widget in both design mode and the final app.

Tip:

If you have a web map or web scene with multiple layers and you want to designate which layers are displayed by default in different Map widgets, you can add the same web map or web scene multiple times on the Data tab, choose to hide different sublayers on each map or scene copy, and connect each copy to a different Map widget.

Learn more about how to configure layer visibility from one map and use it with different Map widgets

Settings

The Map widget includes the following settings:

  • Select map—Add a data source for web maps and web scenes.
  • Initial view—Set the initial position of the map when it loads in the widget.
    • Default—Use the positioning of the map inherited from the web map or web scene.
    • Custom—Modify the initial view by creating a custom position for the map.
  • Tools—Include tools for users to interact with the map.
    • Zoom—Zoom in and out on the map.
    • Home—Zoom the map to the initial map position (extent).
    • Navigation—Include toggling tools for navigation mode of a 3D map (web scene).
    • Locate—Display the user’s current location.
    • Compass—Indicate where north is in relation to the current view of a 2D or 3D map.
    • Search—Find locations based on a geocoding service from your organization or portal.
    • Layers—Display a list of layers and symbols in the map and allow users to turn them on or off.
    • Basemap—Display a gallery of basemaps.
    • Measure—Include measurement tools for measuring area and distance.
    • Fullscreen—Display the map using the entire screen.
    • Scale bar—Include a scale bar on the map that displays units in metric or nonmetric values and dynamically responds to various coordinate systems.
    • Select—Select features on the map using different selection tools and selection modes.
      Note:

      The Map widget automatically hides tools depending on the widget's height to make the widget more responsive to medium and small screen devices. For example, if a Map widget's height is smaller than 465 pixels, the Measure and Locate tools are hidden on small and medium screens even if they are turned on in the widget's settings. As the widget's height decreases, more tools are hidden. The Fullscreen, Search, Zoom, Scale bar, and Compass tools are the last to disappear.

  • Tools layout—Select the layout of the tools based on a large and medium screen size.
  • Options
    • Feature selection colors—Change the highlight color and transparency for features selected in the map. You can customize the highlight fill and outline.
    • Enable scroll zooming—Enable mouse wheel zooming and single-finger panning on the map.
    • Enable pop-up—Enable pop-ups on the map. Turning off this option is useful when working in coordination with the Feature Info widget.
    • Scene quality mode (for web scenes)—Control the quality of the web scene by balancing the visual effect and loading efficiency.
      • Low—Increase performance, stability, and speed by reducing data load.
      • Medium—Equally optimize performance and quality.
      • High—Improve the quality of visualization options (such as water reflection).

Interaction options

The Map widget also supports setting triggers on the Action tab of the widget's settings. You can synchronize two Map widgets by adding an Extent changes trigger to both maps, selecting the other map as the target for both, and choosing the Pan to and Zoom to actions. For web maps, the Zoom to synchronization includes the map's rotate behavior. For web scenes, it includes the rotate and tilt behaviors.

Note:

If a Map widget is configured with both the Zoom to and Pan to actions, then the Zoom to action takes precedence over Pan to. This means that if the user pans and zooms the map at the same time, the Pan to action is ignored.

You can also set triggers and actions to have a map interact with other widgets. For example, you can add an action trigger to make a List widget show only the features that are visible on the map. Triggers and actions are defined and managed on the Action tab. To learn more about the supported features in the Map widget, see Add actions to widgets.