Display a map from a mobile map package

Learn how to display a map from a mobile map package (MMPK).

display a map from a mobile map package

In this tutorial you will display a fully interactive map from a mobile map package (MMPK). The map contains a basemap layer and data layers and does not require a network connection.

Prerequisites

Before starting this tutorial:

  1. You need an ArcGIS Location Platform or ArcGIS Online account.

  2. Your system meets the system requirements.

Steps

Open the Xcode project

  1. To start the tutorial, complete the Display a map tutorial or download and unzip the solution.

  2. Open the .xcodeproj file in Xcode.

Add a mobile map package

You will add a mobile map package (MMPK) to your Xcode project. To get an .mmpk file, you can complete the Create a mobile map package tutorial or download its solution.

Once you have the mobile map package:

  1. In Xcode's app menu, click File > Add Files to "...".
  2. Navigate to and select the .mmpk file. If you used the tutorial solution, it will be named MahouRivieraTrails.mmpk.
  3. Choose Show Options, select the Copy items if needed checkbox, and ensure the project target is selected in Add to targets. Click Add.

Open the mobile map package and display a map

Select a map from the maps contained in a mobile map package, and display it in a map view. Use the MobileMapPackage class to access the mobile map package, and load it to read its contents.

  1. In Xcode, in the Project Navigator, click ContentView.swift.

  2. Update the map variable to initialize a simple map object. Setting a basemap and initial viewpoint is not needed in this scenario.

    ContentView.swift
    Use dark colors for code blocks
    20 21 22 23 24 25 26 27 28 29 30
    Change line
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    struct ContentView: View {
    
        @State private var map = Map()
    
        var body: some View {
    
            MapView(map: map)
    
        }
    
    }
  3. Create a function called loadMobileMapPackage() to set the MobileMapPackage referencing the mobile map package you added to the project.

    ContentView.swift
    Use dark colors for code blocks
    20 21 22 23 24 25 26 27 28 29
    Add line.Add line.Add line.Add line.
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    struct ContentView: View {
    
        @State private var map = Map()
    
        private func loadMobileMapPackage() async throws {
            guard let mobileMapPackage = MobileMapPackage(name: "MahouRivieraTrails", bundle: .main) else { return }
    
        }
    
    }
  4. Load the MobileMapPackage and check that it loads without error. Set the first map in the package to the @State map.

    ContentView.swift
    Use dark colors for code blocks
    24 25 26 27 28 29 30 31
    Add line.Add line.Add line.
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
        private func loadMobileMapPackage() async throws {
            guard let mobileMapPackage = MobileMapPackage(name: "MahouRivieraTrails", bundle: .main) else { return }
    
            try await mobileMapPackage.load()
            guard let map = mobileMapPackage.maps.first else { return }
            self.map = map
    
        }
    
  5. Lastly, as the MapView is being built, use the .task view modifier to asynchronously call the loadMobileMapPackage().

    ContentView.swift
    Expand
    Use dark colors for code blocks
    33 34 35 36 37 38 39 40 41 42 43 44 45
    Add line.Add line.Add line.Add line.Add line.Add line.Add line.
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
        var body: some View {
    
            MapView(map: map)
    
                .task {
                    do {
                        try await loadMobileMapPackage()
                    } catch {
                        print(error)
                    }
                }
    
        }
    
    Expand
  6. Press Command + R to run the app.

You should see a map of trail heads, trails, and parks for the area south of the Santa Monica mountains. You will be able to pinch (to zoom and rotate), drag, and double-tap the map view to explore the map.

What's next?

Learn how to use additional API features, ArcGIS location services, and ArcGIS tools in these tutorials:

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.