Create a web map

Learn how to use the Map Viewer to create a web map for your application.

A web map is a map that you can create with the Map Viewer, stored in ArcGIS, and then use in applications. The Map Viewer allows you to interactively style and configure maps by setting the basemap layer, data layers, layer styles, pop-up settings, and layer visibility ranges. All of the settings are stored as JSON in an item. A number of ArcGIS applications and APIs can access web map items, read the JSON, and then re-create the original scene.

In this tutorial, you use the Map Viewer to create and save a web map using hosted feature layers. You will also inspect the JSON that contains the web map settings.

Prerequisites

You need an ArcGIS Developer or ArcGIS Online account to create and save web maps in Map Viewer.

Steps

Set the basemap layer

To create a web map with the Map Viewer, start by setting the basemap layer. Use the Streets vector tile basemap layer.

Open the Map Viewer and sign into your ArcGIS account.
In the left-panel, click Basemap > Current Basemap > Streets.
In the left-panel, click Basemap to close the window.

Add data layers

To display data in a web map, you can add hosted feature layers for trailheads, trails, and parks in the Santa Monica Mountain area.

In the left-panel, click Add data > Web service.
For each URL:
- Copy and paste the URL > Add to map.
  - Parks and Open Space: https://services3.arcgis.com/GVgbJbqm8hXASVYi/ArcGIS/rest/services/Parks_and_Open_Space/FeatureServer/0
  - Trails: https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0
  - Trailheads: https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0
  - Boundary: https://services3.arcgis.com/GVgbJbqm8hXASVYi/ArcGIS/rest/services/Boundary/FeatureServer/0
Click Save. At minimum, you need to provide a title and tags for your web map.

Your web map should look something like this.

View the web map JSON

A web map item contains JSON that defines the map properties. The structure of the JSON is defined by the Web Map Specification. Applications can access a web map item or read the JSON directly to format layers and create a map, so it is useful to know how to get the JSON for a web map.

In your web browser, find the item ID at the end of the URL for the web map just saved.
- For example: c1ed0753d9be4492a6d4c167febf2163
In a new browser tab, copy and paste the following URL and insert your item ID. This will return the JSON for your web map.
- https://www.arcgis.com/sharing/rest/content/items/<ITEM_ID>/data
- For example: https://www.arcgis.com/sharing/rest/content/items/c1ed0753d9be4492a6d4c167febf2163/data

In the JSON, identify the operational (data) layer and basemap layer settings set earlier. Here's an example:

Use dark colors for code blocksCopy
{
  "operationalLayers":[
    {
      "id":"Boundary_6040",
      "layerType":"ArcGISFeatureLayer",
      "url":"https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Boundary/FeatureServer/0",
      "visibility":true,
      "opacity":1,
      "title":"Boundary",
      "itemId":"30cf3b4c11c5408d87f255ba4e9aa611",
      "popupInfo":{
        "title":"Boundary_0",
        "fieldInfos":[
          {
            "fieldName":"OBJECTID",
            "label":"OBJECTID",
            "isEditable":true,
            "tooltip":"",
            "visible":false,
            "format":{
Expand