Add layers to a map

Overview

You will learn: how to build an app that displays feature layers in a 2D map.

Applications can access and display feature layers that are hosted on ArcGIS Online or ArcGIS Enterprise. A hosted feature layer contains features with the same geometry and attributes, and has its own REST endpoint at a unique URL. The FeatureLayer QML type can use this URL to draw point, polyline, or polygon features on a map. By default, feature layers will draw all features within the extent of the map, but you can customize this by setting your own styles with a renderer or using an SQL expression to limit which features are displayed on the map.

In this tutorial, you will add the Trailheads, Trails, and Parks and Open Space hosted feature layers to the map.

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

Add a layer to the map

1. Run ArcGIS AppStudio. Click your Starter app project in the App Gallery, and then click Edit. This will open your project in Qt Creator.

2. In the Qt Creator Projects window, double-click on MyApp.qml to open it in the editor. In the App declaration, add the following code to declare a property with the URL of the trail heads feature service.

   Use dark colors for code blocksCopy

   1
   2
   3
   4
   property real scaleFactor: AppFramework.displayScaleFactor
   
   // *** ADD ***
   property string trailheadsURL: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0"

3. In the code editor, scroll down to the Map declaration. Add the following code to create a FeatureLayer from the feature service URL and add it to the operational layers of the map.

   Use dark colors for code blocksCopy

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
          Map {
            id:map
   
            BasemapTopographicVector {}
   
            // *** ADD ***
            // add a feature layer of Santa Monica trail heads
            FeatureLayer {
                ServiceFeatureTable {
                    url: trailheadsURL
                }
            }

4. In the lower left Sidebar, click Run or press Control-R/Command-R to run the app.

Add the Trails and Parks and Open Space feature layers

1. In the App declaration, add URL properties for the Trails (lines) and Parks and Open Space (polygons) feature layers.

   Use dark colors for code blocksCopy

   1
   2
   3
   4
   5
   property string trailheadsURL: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0"
   
   // *** ADD ***
   property string trailsURL: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0"
   property string parksURL: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Parks_and_Open_Space/FeatureServer/0"

2. In the Map declaration, add code to add the two layers. Be sure to add them in the correct drawing order: parks, trails, trailheads.

   Use dark colors for code blocksCopy

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
         Map {
           id:map
   
           BasemapTopographicVector {}
   
           // *** ADD ***
           FeatureLayer {
               ServiceFeatureTable {
                   url: parksURL
               }
           }
           FeatureLayer {
               ServiceFeatureTable {
                   url: trailsURL
               }
           }

3. Run your code to view the map. You should see all three layers rendered in the correct order.

Congratulations, you're done!

Your map should load and center on the Santa Monica Mountains with a feature layer that shows the trailheads as orange markers on the map, the trail lines in purple, and the parks and open spaces polygons in blue. Compare your map with our completed solution project.