Overview

You will learn: how to create a 2D web map that can be used in your own apps.

With ArcGIS Online and the Map Viewer you can create, edit and save web maps in the cloud. This is handy for developers because it allows you to create and style maps interactively and then consume them in your applications, minimizing the amount of code you have to write. With the Map Viewer you can search for and add basemaps and layers to your map, and you can also style layers, configure pop-ups, edit data, perform analyses, and much more. A saved web map can easily be accessed by your custom apps to display all of its contents and settings. When you update a web map, the changes will automatically be reflected in apps that access them, allowing you to change the map without making code changes. Web maps are an integral part of many ArcGIS workflows and are the heartbeat of many applications running in the wild today.

In this lab, you will use the Map Viewer to find and add layers sourced from the Los Angeles GeoHub to create a basic two-dimensional web map of trails and parks in Los Angeles county. In later labs, this web map will be further styled and consumed by applications.

Steps

Find layers

  1. Go to ArcGIS Online and sign in.

  2. Open each of the following feature layer items in a new browser tab:

Add layers to a new map

  1. In ArcGIS Online, click Map in the top bar to navigate to the Map Viewer.

  2. Use the Search tool to find and zoom to Santa Monica Mountains.

  3. Click + Add > Add layer from web and copy and paste the Parks and Open Space url and click OK.

    Repeat these steps for Trails, Trailheads and Boundary.

  4. Experiment with dragging and reordering the layers as follows:

    • Trailheads
    • Trails
    • Parks and Open Spaces
    • Boundary
  5. Click on the layers to explore the data.

  6. Save your map.

  7. Click on My Content > {your new map} to view the item details for your new web map.

Congratulations, you're done!

With the default styles, your web map should look something like this.

Challenge

Explore the web map JSON

A web map is just a JSON structure stored as an item in ArcGIS Online. To explore the structure, try pasting this url into your web browser (insert your item id where indicated):

https://www.arcgis.com/sharing/rest/content/items/{ your-item-id }/data

e.g. https://www.arcgis.com/sharing/rest/content/items/c1ed0753d9be4492a6d4c167febf2163/data

NOTE: You might want to try formatting the JSON with this JSON editor tool.

It's good to know how to do this because in some cases you can copy the JSON structures for things like renderers and pop-ups, and use them directly in your code to help format the layers and control the behavior in your app. See the fromJSON() JavaScript documentation for more details.

If you are interested in digging deeper, you can learn more about the web map specification here.

Explore other web maps