English

How To: Limit the zoom extent of a web map shared via an ArcGIS Online web app

Summary

In ArcGIS Online, it is possible to set the initial map extent of a web map when it is opened in a web app or Map Viewer. When sharing web maps via web apps, limiting the zoom extent of the map is useful, so only relevant map information is displayed on the map. This article describes the methods to limit the zoom extent of a shared web map using the Media Map or Minimalist template from ArcGIS Configurable Apps, and ArcGIS Web AppBuilder.

Procedure

Configure the zoom extent of the map in the Media Map or Minimalist template

  1. Log in to ArcGIS Online.
  2. Navigate to the item details page of the web map, and click Create Web App > Configurable Apps.
  3. In the Create a web app window, under Select a configurable app, select Media Map or Minimalist, and click CREATE WEB APP. In this example, Minimalist is selected.
The image shows the Create a web app window.
  1. In the Create a web app window, specify the Title and Tags fields, and click Done.
  2. When prompted with Welcome to the App Setup Page, click Next > Next > Got it, or close the window.
  3. The app editor opens in the Express Setup mode by default. On the left pane, click the opposite direction arrows The image shows the opposite arrows icon. icon. When prompted with Switch to Full Setup, click Switch.
The image shows the app editor page.
  1. On the left pane, click Interactivity > Explore/Navigate. Under the Navigate section, toggle Navigation Boundary on, and click Configure.
The image shows the Interactivity setting in the app editor.
  1. On the Configure Navigation Boundary page, define the navigation boundary of the map.
  2. In the Navigation Options window, under Map Scale, set the minimum and maximum zoom level for the map. The left slider defines the zoom-out limit, and the right slider defines the zoom-in limit of the map. Click Confirm.
The image shows the Configure Navigation Boundary window.
  1. In the app editor, click Publish. When prompted with Are you sure you want to publish the app?, click Confirm.

Configure the zoom extent of the map in ArcGIS Web AppBuilder

  1. Log in to ArcGIS Online.
  2. Navigate to the item details page of the web map, and click Create Web App > Web AppBuilder.
  3. In the Create a New Web App window, specify the Title and Tags fields, and click OK.
  4. On the left pane of the app editor, click the Map tab. Under the Customize visible scales section, click Customize.
The image shows the Map tab in the app editor.
  1. In the Customize visible scales window, click the desired scale numbers, and click Delete. The smallest number defines the zoom-in limit, and the largest number defines the zoom-out limit of the map. Alternatively, type a scale number in the box, and click the add The image shows the add icon. icon. Click OK.
The image shows the Customize visible scale window.
  1. On the left pane of the app editor, click Save, and click Launch.

Related Information

Last Published: 2/22/2021

Article ID: 000024890

Software: Configurable Web Apps Zone.Look.up, time.aware.2016, time.aware.2015, time.aware.2012, summary.viewer, story.map.tour, story.map.swipe.and.spyglass, story.map.shortlist, story.map.series, story.map.journal, story.map.crowdsource, story.map.cascade, story.map.basic.2015, story.map.basic.2012, simple.scene.viewer, simple.map.viewer.2014, simple.map.viewer.2012, scene.styler, public.information, public.gallery, Nearby, minimalist.2016, minimalist.2015, minimal.gallery, media.map, maps.and.apps.gallery, map.tools, map.styler, map.carousel, local.perspective, live.map.beta, layer.showcase, Interactive.Legend, information.lookup, impact.summary, imagery.viewer, image.visit, image.mask, image.interpretation, Geoform, geo.list, finder.2014, finder.2013, find.edit.filter.march.2014, find.edit.filter.july.2014, filter.2014, filter.2012, elevation.profile.2015, elevation.profile.2013, elevation.profile.2012, edit.2015, edit.2013, Directions, Current, crowdsource.reporter, crowdsource.polling, crowdsource.manager, compare.scenes, compare.analysis.2015, compare.analysis.2013, compare, classic.viewer, category.gallery, Basic.Viewer.2016, Basic.Viewer.2014, Attachment.Viewer, 3d.data.visualization