Overview

You will learn: how to display a vector basemap with custom styles in a native app.

With the ArcGIS Runtime SDK for Qt you can build mapping applications that use Esri vector basemaps with custom styles. If you don't already have a custom basemap style, you can create a new one with the ArcGIS Vector Tile Style Editor. This application allows you to create a style interactively and then save the style in ArcGIS Online as a portal item. Each portal item has a unique identifier that your application can use to load the style as a layer or a basemap. See Display a map for more details. To learn more about how to create a new custom style with the ArcGIS Vector Tile Style Editor, see the Style a Vector Basemap tutorial.

In this tutorial, you will build a mapping app that loads a custom vector basemap named Forest and Parks Canvas. This basemap emphasizes national forests and parks.

Before you begin

You must have previously installed the ArcGIS Runtime SDK for Qt and set up the development environment for your operating system.

Steps

Open the starter app project

  1. If you have already completed the Create a starter app tutorial, start Qt Creator and open your starter app project. Otherwise, download and unzip the starter app project solution, and then open it in Qt Creator.

Add a styled vector tile layer as a basemap

  1. Open the main.qml code file in your project (Resources > qml > qml.qrc > /qml > main.qml). You will update the ApplicationWindow QML component to display a custom basemap.

  2. Add a property to define the URL of the vector basemap tile service to the ApplicationWindow QML component immediately after the title property.

    property string myLayerId: "https://www.arcgis.com/home/item.html?id=d2ff12395aeb45998c1b154e25d680e5"
    
  3. Remove the template generated code for the Map component to use a ArcGISVectorTiledLayer as the basemap.

    Map {
      // remove: BasemapTopographicVector {}
    
      // Then replace it with new basemap
      Basemap {
          ArcGISVectorTiledLayer {
              url: myLayerId
          }
      }
    
  4. Run the code and explore the custom national forest and parks vector styles.

Congratulations, you're done!

Your map should display the custom forest and parks canvas basemap. Compare with our completed solution project.

Challenge

Use your own custom basemap

Complete the tutorial Style a Vector Basemap and use your own custom basemap instead of the one provided here.

Add layers

Review the tutorial Create a 2D map with a layer and load the trailheads layer on top of your custom basemap.

Handle load errors

Custom basemaps may not load in your app for multiple reasons, including network availability, the item's privacy settings, or an incorrect item id. Add error handling to your app to alert the user if the map does not load and display a message explaining why.

Update completed tutorials

Return to any of your completed ArcGIS tutorials for Qt and replace the Basemap component with your new custom basemap version.