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 300.1.0 or later is installed.

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

5. The CMake build system 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

Open the project you created by completing the Display a scene tutorial.

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.

In the project Display_a_scene > Display_a_scene > Source Files folder of Qt Creator, double-click the Display_a_scene.cpp file to open it. Remove the unnecessary #include statements for: ArcGISTiledElevationSource.h, ElevationSourceListModel.h, MapTypes.h, Surface.h, and Camera.h. Removing these lines of code will keep you from having compiler warnings.

#include "Display_a_scene.h"

#include "ArcGISTiledElevationSource.h"
#include "ElevationSourceListModel.h"
#include "MapTypes.h"

#include "Scene.h"
#include "SceneQuickView.h"

#include "Surface.h"

#include <QUrl>

#include "Camera.h"

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

Display_a_scene::Display_a_scene(QObject* parent /* = nullptr */):

    QObject(parent),

    m_scene(new Scene(BasemapStyle::ArcGISImagery, this))

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::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();

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.

// 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);

    // Create a camera and set it as the viewpoint on the 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();
}

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

void Display_a_scene::setupScene()
{

  // Create an ArcGIS tiled elevation source using a QUrl to a elevation source.
  const QUrl elevationSource_url(QString(
      "https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"));
  ArcGISTiledElevationSource* elevationSource = new ArcGISTiledElevationSource(elevationSource_url, this);

  // Create a new elevation surface and add the ArcGIS tiled elevation source.
  Surface* elevationSurface = new Surface(this);
  elevationSurface->elevationSources()->append(elevationSource);

  // Set an exaggeration elevation and add the elevation surface to scene.
  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.

Staying in the Display_a_scene.cpp file, 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 .

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 using the web scene’s URL. Then save the file.

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 scene 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.

    // The following methods grant an access token:

    // 1. User authentication: Grants a temporary access token associated with a user's ArcGIS account.
    // To generate a token, a user logs in to the app with an ArcGIS account that is part of an
    // organization in ArcGIS Online or ArcGIS Enterprise.

    // 2. API key authentication: Get a long-lived access token that gives your application access to
    // ArcGIS location services. Go to the tutorial at https://links.esri.com/create-an-api-key.
    // Copy the API Key access token.

    const QString accessToken = QString("");

    if (accessToken.isEmpty())
    {
        qWarning() << "Use of ArcGIS location services, such as the basemap styles service, requires" <<
                      "you to authenticate with an ArcGIS account or set the API Key property.";
    }
    else
    {
        ArcGISRuntimeEnvironment::setApiKey(accessToken);
    }

# TODO: Replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
# root directory resides on your system, example: C:/applications/arcgis-maps-sdk-toolkit-qt
# The code also sets the TOOLKIT_FOUND variable which is used by other parts of the tutorial.

set(ARCGIS_TOOLKIT_REPOSITORY "<path_to_toolkit_repo>")

{

#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

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

In Qt Creator, choose File > Open File or Project… from them menus. In the Open file dialog, navigate to the CMakeLists.txt file for the solution you unzipped and click the Open button.

The Configure Project window will appear for you to specify the Qt Kit to use to compile the project. Check on the Qt Kit called Desktop Qt 6.8.2 MSVC2022 64bit before clicking the Configure Project button at the bottom of the page.

Since the downloaded solution does not contain authentication credentials (API Key or User authentication), 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 scene 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

    // The following methods grant an access token:

    // 1. User authentication: Grants a temporary access token associated with a user's ArcGIS account.
    // To generate a token, a user logs in to the app with an ArcGIS account that is part of an
    // organization in ArcGIS Online or ArcGIS Enterprise.

    // 2. API key authentication: Get a long-lived access token that gives your application access to
    // ArcGIS location services. Go to the tutorial at https://links.esri.com/create-an-api-key.
    // Copy the API Key access token.

    const QString accessToken = QString("");

    if (accessToken.isEmpty())
    {
        qWarning() << "Use of ArcGIS location services, such as the basemap styles service, requires" <<
                      "you to authenticate with an ArcGIS account or set the API Key property.";
    }
    else
    {
        ArcGISRuntimeEnvironment::setApiKey(accessToken);
    }

# TODO: Replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
# root directory resides on your system, example: C:/applications/arcgis-maps-sdk-toolkit-qt
# The code also sets the TOOLKIT_FOUND variable which is used by other parts of the tutorial.

set(ARCGIS_TOOLKIT_REPOSITORY "<path_to_toolkit_repo>")

{

#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.