The order of the layers in ArcGIS Online Map Viewer is displayed differently in ArcGIS Web AppBuilder

Description

When adding layers to ArcGIS Online Map Viewer, the order of the layers in the Layers pane is displayed based on the order the layers are added if no changes are made to the order. However, adding the web map containing map services or map image layers to ArcGIS Web AppBuilder displays a different order of the layers in the Layer List widget than in ArcGIS Online Map Viewer.

Cause

This is a known limitation in the older ArcGIS API for JavaScript 3.x web apps such as ArcGIS Web AppBuilder, Classic Story Maps and ArcGIS Online Map Viewer Classic. Map services or map image layers are placed at the bottom of the list.

Solution or Workaround

Use one of the methods below to resolve the issue.

Use ArcGIS Experience Builder

1. Open the web map in ArcGIS Online Map Viewer.
2. On the Contents (dark) toolbar, click the More button. Click Create app, and select Experience Builder.
3. Select the template and click Create. Add the Map Layers widget if necessary. Refer to ArcGIS Experience Builder: Map Layers widget for more information.

Note:
Alternatively, toggle on Layers under Tools in the Map widget’s configuration pane.

4. Save the web experience.

The image below shows the order of the layers in ArcGIS Experience Builder is displayed similarly to the layers’ order in ArcGIS Online Map Viewer.

Use ArcGIS Instant Apps

1. Open the web map in ArcGIS Online Map Viewer.
2. On the Contents (dark) toolbar, click the More button. Click Create app, and select Instant Apps.
3. Select the app template and click Choose. Edit the title if needed and click Create app.
4. In the Express pane, click Step 3. Interactivity and toggle on Layer list. Click Publish after all necessary edits are done.

The image below shows the order of the layers in ArcGIS Instant Apps is displayed similarly to the layers’ order in ArcGIS Online Map Viewer.