Add layers to a map (offline)

Overview

You will learn: how to load a basemap and feature layers from a mobile map package (.mmpk) file.

The ArcGIS Runtime SDK for Qt allows you to provide offline maps to your users so they can be productive when their network connectivity is poor or offline. The map package is a file created with another tool, such as ArcGIS Pro, and loaded to your user's device.

Before you begin

You must have previously installed the ArcGIS Runtime SDK for Qt and set up your development environment. Please review the install and setup instructions if you have not done this.

Prepare your data

Complete the lab Prepare your data for offline use. You will use the map package file created in that lab for the offline map data required in this lab.

Steps

Create a new ArcGIS Runtime App Qt Creator Project

1. Start Qt Creator.

2. Choose File > New File or Project and select the ArcGIS project template for ArcGIS Runtime 100.0.0 Qt Quick app. Give your app a name. For this lab we chose add-layers-to-a-map-offline, but you can choose any name that suits you. Also select the location where your project files should reside on your system. Select Continue.

3. On the Define Project Details dialog, leave the settings as suggested. Select Continue.

4. On the Kit Selection dialog, check the kits you previously setup when you installed the SDK. Select Continue.

5. Verify your selections and select Done.

Load your map package on to your device

6. You created a map package in the lab Prepare your data for offline use. Load that file on to your device. If you did not complete that lab, download the map package we prepared.

Load and display the map package

7. Open the main.qml code file in your project (Resources > qml > qml.qrc > /qml > main.qml). If you followed the prior steps, it should already be open in the IDE.

8. Add a new import statement to import the ArcGISExtras library. You need this to use the System component that defines the userHomePath property you use later in this lab to access the map package file with a device independent path.

   import Esri.ArcGISExtras 1.1
   

9. Update the ApplicationWindow QML component with a property holding the path to the map package file. Add this new property immediately after the title property.

   property url dataPath: System.userHomePath + "/data/devlabs-package.mmpk"
   

10. Update the MapView to remove the template code that loads the map, as your map will no longer load from an online server but instead use the map package. Assign an id to the MapView so you can reference it from other code. You load the map package separately in the next step.

    MapView {
        id: mapView
        anchors.fill: parent
    }
    

11. Add a MobileMapPackage component to load the map package file and then update your MapView to display it.

    MobileMapPackage {
        id: mapPackage
        path: dataPath
    
        Component.onCompleted: {
            mapPackage.load();
        }
    
        onLoadStatusChanged: {
            if (loadStatus === Enums.LoadStatusLoaded) {
                mapView.map = mapPackage.maps[0];
            } else if (loadStatus === Enums.LoadStatusfailedToLoad) {
                mapView.map = fallBackMap;
            }
        }
    }
    

12. Create an online map to use as a fall back in case the map package does not load. This way your app displays a map in case of failure to load the map package.

    Map {
        id: fallBackMap
        BasemapTopographicVector {}
    }
    

Congratulations, you're done!

Your map, as it was designed in ArcGIS Pro, should load and display with the view point centered on the Santa Monica Mountains. Compare your map with our completed solution project.

Next labs

Set up authenticated services

Use ArcGIS for Developers to create proxies so applications can easily access premium services.

5 minutes Start Lab

Challenge

Change map contents

Change map package