You will learn: how to create a 3D web scene that you can use in your own apps.

The Scene Viewer allows you to create, edit and save web scenes in ArcGIS Online. This is handy for developers because it allows you to compose maps interactively and then load them into your applications, reducing the amount of code you have to write. The viewer allows you to search for and add basemaps and layers to your map, style layers, create slides, and much more. A saved web scene can easily be accessed by your custom applications to display all of its contents and settings. Furthermore, when you update a web scene, the changes will automatically be reflected in apps that access them, allowing you to change the scene without making code changes. Learn more about web scenes and the specification here.

In this lab, you will use the Scene Viewer to add layers to create a web scene of trails and parks near LA.


  1. Go to ArcGIS Online and sign in.

  2. In the top nav, click Scene to launch the Scene Viewer.

  3. In the Designer, click + Add Layers > Enter Layer URL (at the bottom). Use the urls below and the dialog to add the following layers:

    • 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
  4. Tilt and zoom the view by clicking Rotate and then click and drag on the map until you can see the horizon.

  5. Save the scene.

Congratulations, you're done!

Your web scene should look something like this.


Explore the web scene JSON

A web scene is 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/a82026c675804e95be448b300c70bc03/data

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

It's good to know how to access the JSON because you can copy the JSON structures for things like renderers and pop-ups, and use them directly in your code to 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 Scene Specification.