Overview

You will learn: how to display a web map that you created in the Create a web map design tutorial.

A web map is a JSON structure that contains the settings required to display a 2D map. ArcGIS and custom applications can load web maps and automatically configure the map extent, basemap, layers and styles, pop-ups, labels and more. Web maps can be created interactively with the Map Viewer and ArcGIS Pro. Web maps are stored in ArcGIS Online or ArcGIS Enterprise as an item with a unique ID.

In this tutorial, you will build an app that loads and displays a web map.

Before you begin

Make a copy of the finished starter app project (or download here) and open the .xcodeproj file in Xcode.

Steps

Add a web map to the map

  1. In the ViewController.swift file, we'll change the way the AGSMap is initialized to reference the web map that was created in the Configure pop-ups design tutorial.

     override func viewDidLoad() {
         super.viewDidLoad()
    
         /*** UPDATE ***/
         let itemId = "41281c51f9de45edaf1c8ed44bb10e30" // This was created in the Configure pop-ups design tutorial
         let map = AGSMap(url: URL(string: "https://www.arcgis.com/home/item.html?id=\(itemId)")!)
         /*** UPDATE ***/
    
         mapView.map = map
     }
    
  2. Now press Command-R to run the app.

Congratulations, you're done!

Your app should display a map that looks like this.

Your project should look something like this.

Challenge

Use your web map

Instead of using the web map we prepared, use the web map you made in the design tutorial Create a Web Map (2D).

In Step 1 above, replace the itemId variable with the id of your web map.

Change your map design

Open your web map in the ArcGIS Online Map Viewer, make changes to your map design, then save your map. Next time you load that map in your app your changes will be reflected.