The Legend widget displays labels and symbols for layers in a map. The legend displays layers and sublayers that you make visible.
Example
Use this widget to support app design requirements such as the following:
- You want to add a legend to a map to help users understand the map symbols.
Usage notes
This widget requires a connection to a Map widget with a configured data source. The Map widget must be in the same page as the legend.
Currently, the Legend widget doesn’t support the following layer types: elevation, integrated mesh, OpenStreetMap, vector tile, web tile, graphics, KML, and map notes. Dictionary renderers and 3D symbols with more than one symbol layer are also not supported.
Settings
The Legend widget includes the following settings:
- Source—Select a Map widget in the page that’s connected to a 2D or 3D map.
- Legend mode—Choose to have the legend display all visible layers or only display visible layers that are within the current map extent.
- Show basemap legends—Include basemap layers in the legend.
- Use card style—Show map layers as cards in the legend that appear side by side (with a horizontal scroll bar) or stacked (to view one card at a time). By default, the legend has a portrait orientation and a user can scroll vertically when it includes several layers. Turn on this setting for wide views to display the legend with a landscape orientation or for mobile apps to collapse the legend to occupy less space. Choose one of the following options:
Tip:
To experiment with these options, click Live view on the builder toolbar.
- Auto—Responsive layout. The legend appears as a side-by-side layout in wide views and a stacked layout in smaller (mobile) views.
- Side by side—Landscape orientation with a horizontal scroll bar to view multiple legend cards at a time.
- Stack—Stacked cards to view only one legend card at a time, conserving space.
- Advanced—Override your app’s theme to change the widget’s font and background color.
- Font—Change the font color for text in the widget.
- Background—Change the background color of the widget.