Display a web scene

Before starting this tutorial:

1. You need an ArcGIS Location Platform or ArcGIS Online account.

2. Your system meets the system requirements.

3. The ArcGIS Maps SDK for Qt, version 200.8.0 or later is installed.

4. The Qt 6.8.2 software development framework or later is installed.

Option 1: Develop the code

To start the tutorial, complete the Display a scene tutorial. This creates a scene to display an area of the Santa Monica Mountains in a scene view.

Open a Qt Creator project

1. Open the project you created by completing the Display a scene tutorial.
2. Continue with the following instructions to display a scene from a web scene stored in ArcGIS.

Get the web scene item ID

You can use ArcGIS tools Tools, also known as developer tools, are ArcGIS software applications such as portal and ArcGIS Pro that developers can use to prepare content and data for custom applications they are building. Learn more to create and view web scenes A web scene is a scene stored as a JSON object that defines properties such as the basemap layer, data layers, layer styles, and pop-up styles. Its JSON structure is defined by the web scene specification. Learn more . Use the Scene Viewer Scene Viewer(™) is a browser-based mapping tool that can view, create, and save web scenes. Learn more to identify the web scene item ID An item ID is a unique identifier representing a single item stored, managed, and accessed in a portal, such as a web map, hosted layer, or file. Learn more . This item ID will be used later in the tutorial.

1. Go to the LA Trails and Parks web scene in the Scene Viewer in ArcGIS Online ArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account. Learn more . This web scene displays trails, trailheads and parks in the Santa Monica Mountains.
2. Make a note of the item ID at the end of the browser’s URL. The item ID should be 579f97b2f3b94d4a8e48a5f140a6639b.

Remove unneeded code

A web scene A web scene is a scene stored as a JSON object that defines properties such as the basemap layer, data layers, layer styles, and pop-up styles. Its JSON structure is defined by the web scene specification. Learn more can define all of the content created in this code, such as the basemap A basemap is the foundational layer and data that provides the overall visual and geographic context for a map or scene. It typically includes geographic features and labels for land, water, roads, buildings, cities, places, and administrative boundaries, but can also include raster data such as satellite and areal images. Learn more , elevation layer An elevation layer is a layer that defines the ground height or the surface for a scene. Learn more , and initial viewpoint A viewpoint is a set of parameters used to define a geographic area visible in a map or scene. Learn more . Accordingly, the following code needs to be removed or changed.

1. In the project Sources folder of Qt Creator, open the Display_a_scene.cpp file.

2. Remove the unnecessary #include statements for: ArcGISTiledElevationSource.h, Camera.h, ElevationSourceListModel.h, MapTypes.h, and Surface.h. Removing these lines of code will keep you from having compiler warnings.

   Display_a_scene.cpp

   #include "Display_a_scene.h"
   
   
   #include "ArcGISTiledElevationSource.h"
   
   #include "Camera.h"
   
   #include "ElevationSourceListModel.h"
   #include "MapTypes.h"
   
   #include "Scene.h"
   #include "SceneQuickView.h"
   
   #include "Surface.h"
   
   #include <QUrl>

3. Remove the comma after QObject(parent) and then modify the constructor to remove initialization with BasemapStyle and the Scene.

   Display_a_scene.cpp

   Display_a_scene::Display_a_scene(QObject* parent /* = nullptr */):
   
       QObject(parent),
   
       m_scene(new Scene(BasemapStyle::ArcGISImagery, this))

4. Continuing to edit the Display_a_scene constructor, remove the following lines since you will not be using an ArGISTiledElevationSource from a QUrl and applying it to the Scene.

   Display_a_scene.cpp

   Display_a_scene::Display_a_scene(QObject* parent /* = nullptr */):
   
       QObject(parent)
   {
   
       // create a new elevation source from Terrain3D rest service
       ArcGISTiledElevationSource* elevationSource = new ArcGISTiledElevationSource(
                   QUrl("https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"), this);
   
       // add the elevation source to the scene to display elevation
       m_scene->baseSurface()->elevationSources()->append(elevationSource);
   
       setupScene();

5. Moving down in the same code file, in the setSceneView(SceneQuickView* sceneView) method, remove the following lines for the Camera object and all of its arguments.

   Display_a_scene.cpp

   // Set the view (created in QML)
   void Display_a_scene::setSceneView(SceneQuickView* sceneView)
   {
       if (!sceneView || sceneView == m_sceneView)
       {
           return;
       }
   
       m_sceneView = sceneView;
       m_sceneView->setArcGISScene(m_scene);
   
       constexpr double latitude = 33.909;
       constexpr double longitude = -118.805;
       constexpr double altitude = 5330.0;
       constexpr double heading = 355.0;
       constexpr double pitch = 72.0;
       constexpr double roll = 0.0;
       const Camera sceneCamera(latitude, longitude, altitude, heading, pitch, roll);
       m_sceneView->setViewpointCameraAndWait(sceneCamera);
   
       emit sceneViewChanged();
   }

6. Again moving down in the same code file, now in the setupScene() method, remove all of the existing code within the curly braces.

   Display_a_scene.cpp

   void Display_a_scene::setupScene()
   {
   
     ArcGISTiledElevationSource* elevationSource = new ArcGISTiledElevationSource(QUrl("https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"), this);
   
     Surface* elevationSurface = new Surface(this);
     elevationSurface->elevationSources()->append(elevationSource);
   
     elevationSurface->setElevationExaggeration(2.5);
     m_scene->setBaseSurface(elevationSurface);
   
   }

   Loading a scene A scene is a collection of layers that are displayed in 3D. It is typically composed of a basemap layer, data layers, and 3D data. Learn more from a web scene A web scene is a scene stored as a JSON object that defines properties such as the basemap layer, data layers, layer styles, and pop-up styles. Its JSON structure is defined by the web scene specification. Learn more usually requires less code and makes it easier to update a scene used by several apps. Furthermore, web scenes can provide a more consistent experience for your user.

Display a web scene using its portal item URL

You can display a web scene A web scene is a scene stored as a JSON object that defines properties such as the basemap layer, data layers, layer styles, and pop-up styles. Its JSON structure is defined by the web scene specification. Learn more using the web scene’s item ID An item ID is a unique identifier representing a single item stored, managed, and accessed in a portal, such as a web map, hosted layer, or file. Learn more . Create a scene A scene is a collection of layers that are displayed in 3D. It is typically composed of a basemap layer, data layers, and 3D data. Learn more from the web scene portal item An item, also known as a content item, is a resource stored in a portal such as a web map, hosted layer, style, script tool, file, or notebook. Learn more , and display it in your app.

1. Add code to the setupScene() method to create the web scene A web scene is a scene stored as a JSON object that defines properties such as the basemap layer, data layers, layer styles, and pop-up styles. Its JSON structure is defined by the web scene specification. Learn more portal URL. Concatenate the web scene’s unique item ID An item ID is a unique identifier representing a single item stored, managed, and accessed in a portal, such as a web map, hosted layer, or file. Learn more and the URL for ArcGIS Online ArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account. Learn more .

   Display_a_scene.cpp

   void Display_a_scene::setupScene()
   {
   
       // Create an item_id to reference an item at a web server
       const QString item_id("579f97b2f3b94d4a8e48a5f140a6639b");
   
       // Create a QUrl from the web scene server URL and the item_id
       const QUrl portal_url(QString("https://arcgis.com/sharing/rest/content/items/" + item_id));
   
   }

2. Create the Scene using the web scene’s URL.

   Display_a_scene.cpp

   void Display_a_scene::setupScene()
   {
   
       // Create an item_id to reference an item at a web server
       const QString item_id("579f97b2f3b94d4a8e48a5f140a6639b");
   
       // Create a QUrl from the web scene server URL and the item_id
       const QUrl portal_url(QString("https://arcgis.com/sharing/rest/content/items/" + item_id));
   
       // Create the scene, referencing the QUrl
       m_scene = new Scene(portal_url, this);
   
   }

Set developer credentials

For the final steps of this tutorial, click the tab below that corresponds to the authentication type (API key authentication or User authentication) that you chose when you completed the Display a map tutorial.

Be sure to also provide the same authentication (API key or user authentication Client ID/Redirect URL) that you used for the Display a map tutorial.

ARCGIS_RUNTIME_VERSION = 200.8.2
include($$PWD/arcgisruntime.pri)

# TODO: You need to replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
# resides on your system, example: C:/arcgis-maps-sdk-toolkit-qt/uitools/toolkitcpp/toolkitcpp.pri
# This block determines whether you've cloned your toolkit
PATH_TO_TOOLKIT = "<path_to_toolkit_repo>/uitools/toolkitcpp/toolkitcpp.pri"

exists($${PATH_TO_TOOLKIT}) {
  message("Toolkit found")
  DEFINES += TOOLKIT_FOUND

  # include the toolkitcpp.pri, which contains all the toolkit resources
  include($${PATH_TO_TOOLKIT})

  qtHaveModule(webenginequick) {
    QT += webenginequick
  }
} else {
  message("Toolkit not found in provided path. Either set PATH_TO_TOOLKIT or use an API Key")
}

#ifdef TOOLKIT_FOUND

    // Define the Redirect URL string obtained when creating the OAuth credentials.
    // TODO: You need to replace the "REDIRECT_URL" with your own valid string,
    // ex: "urn:ietf:wg:oauth:2.0:oob"
    const auto qStringRedirectUrl = QString{"REDIRECT_URL"};

    // Define the URL of the portal to authenticate with.
    const QUrl qUrlPortal = QUrl{"https://www.arcgis.com/"};

    // Define a unique identifier associated with an application registered with the
    // portal that assists with client/server OAuth authentication.
    // TODO: You need to replace the "CLIENT_ID" with your own valid string.
    const QString qStringClientId = QString{"CLIENT_ID"};

    // Create a new OAuth user configuration using: the Url to mapping web service, the Client ID
    // string, and the Redirect Url string.
    auto* oAuthUserConfiguration = new OAuthUserConfiguration(qUrlPortal, qStringClientId,
                                                              qStringRedirectUrl, this);

    // Call the Toolkit's OAuthUserConfigurationManager static `addConfiguration`
    // method to use the OAuth dialog. This will tell the Authenticator to use OAuth for the provided configuration.
    Toolkit::OAuthUserConfigurationManager::addConfiguration(oAuthUserConfiguration);
#endif // TOOLKIT_FOUND

Press Ctrl + R to run the app.

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

Option 2: Download the solution

1. Click the Download solution link under Solution and unzip the file to a location on your machine.

2. Open the .pro project file in Qt Creator.

Since the downloaded solution does not contain authentication credentials, you must set up authentication to create the developer credentials and add them to the project.

For the final steps of this tutorial, click the tab below that corresponds to the authentication type (API key authentication or User authentication) that you chose when you completed the Display a map tutorial.

Be sure to also provide the same authentication (API key or user authentication Client ID/Redirect URL) that you used for the Display a map tutorial.

Set developer credentials in the solution

ARCGIS_RUNTIME_VERSION = 200.8.2
include($$PWD/arcgisruntime.pri)

# TODO: You need to replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
# resides on your system, example: C:/arcgis-maps-sdk-toolkit-qt/uitools/toolkitcpp/toolkitcpp.pri
# This block determines whether you've cloned your toolkit
PATH_TO_TOOLKIT = "<path_to_toolkit_repo>/uitools/toolkitcpp/toolkitcpp.pri"

exists($${PATH_TO_TOOLKIT}) {
  message("Toolkit found")
  DEFINES += TOOLKIT_FOUND

  # include the toolkitcpp.pri, which contains all the toolkit resources
  include($${PATH_TO_TOOLKIT})

  qtHaveModule(webenginequick) {
    QT += webenginequick
  }
} else {
  message("Toolkit not found in provided path. Either set PATH_TO_TOOLKIT or use an API Key")
}

#ifdef TOOLKIT_FOUND

    // Define the Redirect URL string obtained when creating the OAuth credentials.
    // TODO: You need to replace the "REDIRECT_URL" with your own valid string,
    // ex: "urn:ietf:wg:oauth:2.0:oob"
    const auto qStringRedirectUrl = QString{"REDIRECT_URL"};

    // Define the URL of the portal to authenticate with.
    const QUrl qUrlPortal = QUrl{"https://www.arcgis.com/"};

    // Define a unique identifier associated with an application registered with the
    // portal that assists with client/server OAuth authentication.
    // TODO: You need to replace the "CLIENT_ID" with your own valid string.
    const QString qStringClientId = QString{"CLIENT_ID"};

    // Create a new OAuth user configuration using: the Url to mapping web service, the Client ID
    // string, and the Redirect Url string.
    auto* oAuthUserConfiguration = new OAuthUserConfiguration(qUrlPortal, qStringClientId,
                                                              qStringRedirectUrl, this);

    // Call the Toolkit's OAuthUserConfigurationManager static `addConfiguration`
    // method to use the OAuth dialog. This will tell the Authenticator to use OAuth for the provided configuration.
    Toolkit::OAuthUserConfigurationManager::addConfiguration(oAuthUserConfiguration);
#endif // TOOLKIT_FOUND

Run the solution

Press Ctrl + R to run the app.

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