Display a web scene

Learn how to create and display a scene from a web scene stored in ArcGIS.

This tutorial shows you how to create and display a scene from a web scene. All web scenes are stored in ArcGIS with a unique item ID. You will access an existing web scene by item ID and display its layers. The web scene contains feature layers for the Santa Monica Mountains in California.

Prerequisites

Before starting this tutorial:

You need an ArcGIS Location Platform or ArcGIS Online account.
Confirm that your system meets the system requirements.
An IDE for Android development in Kotlin.

Steps

Create a new Android Studio project

To start this tutorial, complete the Display a scene tutorial. Or download and unzip the Display a scene solution in a new folder.
Modify the old project for use in this new tutorial. Expand More info for instructions.
1. On your file system, delete the .idea folder, if present, at the top level of your project.
2. In the Android tool window, open app > res > values > strings.xml.
  
  In the <string name="app_name"> element, change the text content to Display a web scene.
  strings.xml
  Use dark colors for code blocks
  1 2 3 4 5 <resources> <string name="app_name">Display a web scene</string> </resources>
3. In the Android tool window, open Gradle Scripts > settings.gradle.
  
  Change the value of rootProject.name to "Display a web scene".
  settings.gradle
  Expand
  Use dark colors for code blocks
  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 rootProject.name = "Display a web scene" include ':app'
4. Click File > Sync Project with Gradle files. Android Studio will recognize your changes and create a new .idea folder.
If you downloaded the solution, get an access token and set the API key.
1. Go to the Create an API key tutorial to obtain a new API key access token using your ArcGIS Location Platform or ArcGIS Online account. Ensure that the following privilege is enabled: Location services > Basemaps > Basemap styles service. Copy the access token as it will be used in the next step.
2. In Android Studio: in the Android tool window, open app > java > com.example.app > MainActivity.
3. In the setApiKeyForApp() method, find the ArcGISRuntimeEnvironment.setApiKey("YOUR_ACCESS_TOKEN") call and paste your access token inside the double quotes, replacing YOUR_ACCESS_TOKEN.
  MainActivity.kt
  Use dark colors for code blocks
  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 private fun setApiKeyForApp(){ ArcGISRuntimeEnvironment.setApiKey("YOUR_ACCESS_TOKEN") }
  Warning
  The access token is stored directly in the code as a convenience for this tutorial. Storing access tokens in the source code is not best practice.

Prepare files before coding the app

Modify the files from the Display a scene tutorial so that you can use them in this tutorial: you will add imports, change the application title, and remove unnecessary code.

In the Android Studio, in the Android tool window, open app > java > com.example.app and then click MainActivity. Add the following imports, replacing those from the Display a scene tutorial.

MainActivity.kt
Use dark colors for code blocks
package com.example.app

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

import com.esri.arcgisruntime.ArcGISRuntimeEnvironment
import com.esri.arcgisruntime.mapping.ArcGISScene
import com.esri.arcgisruntime.mapping.view.SceneView
import com.esri.arcgisruntime.portal.Portal
import com.esri.arcgisruntime.portal.PortalItem

import com.example.app.databinding.ActivityMainBinding

In start(), delete the code for base surface, surface elevation, camera, and camera viewpoint. The web scene defines these characteristics, so you don't have to set them in your app.

MainActivity.kt
Use dark colors for code blocks
    // set up your scene here. You will call this method from onCreate()
    private fun setupScene() {

        val scene = ArcGISScene(BasemapStyle.ARCGIS_IMAGERY_STANDARD)

        // set the scene on the scene view
        sceneView.scene = scene

        // add base surface for elevation data
        val elevationSource = ArcGISTiledElevationSource("https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer")
        val surface = Surface(listOf(elevationSource))
        // add an exaggeration factor to increase the 3D effect of the elevation.
        surface.elevationExaggeration = 2.5f

        scene.baseSurface = surface

        // Point(x, y, z, spatialReference)
        val cameraLocation = Point(-118.794, 33.909, 5330.0, SpatialReferences.getWgs84())
        // Camera(location, heading, pitch, roll)
        val camera = Camera(cameraLocation, 355.0, 72.0, 0.0)

        sceneView.setViewpointCamera(camera)

    }

In start(), delete the code that creates an ArcGISScene by passing a basemap. In this tutorial, you will pass a portal item instead.

MainActivity.kt
Use dark colors for code blocks
    // set up your scene here. You will call this method from onCreate()
    private fun setupScene() {

        val scene = ArcGISScene(BasemapStyle.ARCGIS_IMAGERY_STANDARD)

        // set the scene on the scene view
        sceneView.scene = scene

    }

Get the web scene item ID

You can use ArcGIS tools to create and view web scenes. Use the Scene Viewer to identify the web scene item ID. This item ID will be used later in the tutorial.

Go to the LA Trails and Parks web scene in the Scene Viewer in ArcGIS Online. This web scene displays trails, trailheads and parks in the Santa Monica Mountains.
Make a note of the item ID at the end of the browser's URL. The item ID should be 579f97b2f3b94d4a8e48a5f140a6639b.

Display the web scene

You can display a web scene using the web scene's item ID. Create a scene from the web scene portal item, and display it in your app.

In the setupScene() method, create a new Portal referencing ArcGIS Online as the portalUrl parameter and false for the loginRequired parameter.

MainActivity.kt
Expand
Use dark colors for code blocks
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
73
74
75
76
77
77
77
77
77
77
78
79
80
81
82
82
82
Add line.    // set up your scene here. You will call this method from onCreate()
    private fun setupScene() {

        val portal = Portal("https://www.arcgis.com", false)


        // set the scene on the scene view
        sceneView.scene = scene

    }
Expand

Create a PortalItem for the web scene, by passing the portal and the web scene's item ID as parameters.

Create an ArcGISScene using the portalItem as the constructor parameter.

MainActivity.kt
Expand
Use dark colors for code blocks
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
87
87
Add line.Add line.Add line.    // set up your scene here. You will call this method from onCreate()
    private fun setupScene() {

        val portal = Portal("https://www.arcgis.com", false)

        val itemId = "579f97b2f3b94d4a8e48a5f140a6639b"
        val portalItem = PortalItem(portal, itemId)

        val scene = ArcGISScene(portalItem)


        // set the scene on the scene view
        sceneView.scene = scene

    }
Expand

Use the existing code to display the new ArcGISScene on the scene view by setting the scene property on the sceneView.

MainActivity.kt
Expand
Use dark colors for code blocksCopy
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
87
87
    // set up your scene here. You will call this method from onCreate()
    private fun setupScene() {

        val portal = Portal("https://www.arcgis.com", false)

        val itemId = "579f97b2f3b94d4a8e48a5f140a6639b"
        val portalItem = PortalItem(portal, itemId)

        val scene = ArcGISScene(portalItem)


        // set the scene on the scene view
        sceneView.scene = scene

    }
Expand

Click Run > Run > app to run the app.

Your app should display the scene that you viewed earlier in the Scene Viewer.

What's Next?

Learn how to use additional API features, ArcGIS location services, and ArcGIS tools in these tutorials: