Overview
You will learn: how to build an app that loads and displays a layer from ArcGIS Online.
Applications can access layers that are hosted on ArcGIS Online or ArcGIS Enterprise. Each layer item contains the settings for the hosted feature layer such as the URL to access the data, the styles used to draw the layer, the pop-up configuration, and the data filters. These settings can be pre-configured interactively using portal tools. Applications can load layer items by accessing a portal and requesting the item by ID. The benefit of loading a layer item is that all of the layer settings will be applied when the item is loaded, saving you time from having to set them up yourself. Learn more about working with layers in the Configure layers tutorial.
In this tutorial, you will add layers to the map that have been pre-configured and stored as an item in ArcGIS Online.
Before you begin
You must have previously installed ArcGIS AppStudio.
Open the starter app project
If you completed the Create a starter app tutorial, start ArcGIS AppStudio and then open your starter app project. Otherwise, complete the tutorial now and open the project.
Steps
Find the ID of the Trailheads layer
- In your browser, go to the Trailheads Styled layer on ArcGIS Online and find the item ID at the end of the URL. It should be
33fc2fa407ab40f9add12fe38d5801f5
.
Declare properties
-
Run ArcGIS AppStudio. Click your Starter app project in the App Gallery, and then click Edit. This will open your project in Qt Creator.
-
In the Qt Creator Projects window, double-click MyApp.qml to open it in the editor. In the
App
declaration, add the following properties to specify the URL of the portal and the layer item ID.Use dark colors for code blocks Copy property real scaleFactor: AppFramework.displayScaleFactor // *** ADD *** property string portalUrl: "https://arcgis.com"; property string trailheadsItemID: "33fc2fa407ab40f9add12fe38d5801f5"
Load the portal
-
In the
App
declaration, just below the properties, declare aPortal
type to create an unauthenticated connection to the ArcGIS Online portal.Use dark colors for code blocks Copy property string trailheadsItemID: "33fc2fa407ab40f9add12fe38d5801f5" // *** ADD *** Portal { id: arcgisOnline url: portalUrl loginRequired: false }
Load a portal item
-
After the
Portal
declaration, declare aPortal
type to load the layer with the Trailheads Styled item ID from the ArcGIS Online portal.Item Use dark colors for code blocks Copy PortalItem { id: portalItemTrailheads portal: arcgisOnline itemId: trailheadsItemID }
Add the feature layer
-
In the code editor, scroll down to the
Map
declaration. Add code after the basemap declaration to create aFeature
from the portal item.Layer Use dark colors for code blocks Copy Map { id:map BasemapTopographicVector {} // *** ADD *** FeatureLayer { id:trailheadFeatureLayer item: portalItemTrailheads serviceLayerId: "0" }
-
After the declaration of
Feature
, add a callback to append the feature layer to theLayer operational
of the map when the layer loads.Layers Use dark colors for code blocks Copy FeatureLayer { id:trailheadFeatureLayer item: portalItemTrailheads serviceLayerId: "0" } // *** ADD *** onLoadStatusChanged: { if (loadStatus === Enums.LoadStatusLoaded) { map.operationalLayers.append(trailheadFeatureLayer); } }
-
In the lower left Sidebar, click Run or press Control-R/Command-R to run the app.
Congratulations, you're done!
Your app should display a map with the trailheads centered on the Santa Monica Mountains. Compare your solution with our completed solution project.