Workflow: Create an app using a web map (on-demand)

Simple offline mapping app

In this workflow, you will learn how to create a web map, enable it for offline use, then use it to create a partially offline app. Later on, your app will request for an area within the map to download. This is also known as the on-demand method because you are defining which areas in the map to take offline on demand.

Prerequisites

You need an account for ArcGIS Online or ArcGIS Enterprise to host data for offline use and get an access token. If you need an account, go to Get started.

Steps

1. Prepare the map and data

Create a web map

To create a web map with the Map Viewer, start by setting the basemap layer. Use the Streets vector tile basemap layer.

  1. In your web browser, open the Map Viewer and sign into your ArcGIS account.

  2. In the left panel, click Basemap > Current Basemap > Streets.

  3. In the left panel, click Basemap to close the window.

Set focus to an area of interest

To specify the viewpoint of the map to an area of interest, use the magnifier icon and set the map properties to preserve map scale.

  1. In the bottom right panel, click the magnifier icon.

  2. Type in Santa Monica in the search field and hit enter. This will set your map focus to an area of interest, which, in this case, is the city of Santa Monica, California.

  3. In the left panel, click Map properties.

  4. Under Map view, toggle on the Preserve map scale. This will ensure that the map focus stays on the city of Santa Monica, California, even after you close the web map.

Your web map should look something like this.

Save the web map

Now that you have a web map, you need to save it to your portal.

  1. In the left panel, click Save > Save as. At minimum, you need to provide a title and tags for your web map.

By default, your web map sharing level is set to Owner. Later, you will need an access token that is scoped to access the web map item for use in your offline app.

Enable web map for offline use

  1. In your web browser, find the item ID at the end of the URL for the web map you just saved.

    • For example: 8ab76e9c5352400d87ca3315db9ba08e
  2. In a new browser tab, copy and paste the following URL and insert your item ID. This will return the item page for your web map, where you can configure it for offline use.

  3. Click Settings on the top bar of the item page. Settings

  4. Scroll down to the Offline menu. Offline section

  5. If you don't see the Offline enabled icon at the top right corner, click Check Compatibility and turn on Offline.

  6. Optionally, you can also manage advanced offline settings for your web map by clicking Options. These settings allow you to choose what data or updates mobile devices get and use a tile package for your offline basemap.

  7. Click Save. Your web map is enabled for offline use now.

2. Build the app

Setup offline app

  1. Install and setup the ArcGIS Maps SDK for .NET on your development machine. Make sure you fulfill the SDK's system requirements.

  2. Follow the Display a map tutorial or download the completed solution to get a starter code for this workflow.

  3. Open the .sln file in Visual Studio.

    The Visual Studio solution, project, and the namespace for all classes currently use the name DisplayAMap. Follow the steps below if you prefer the name to reflect the current tutorial. These steps are not required, your code will still work if you keep the original name.

  4. Update the name for the solution and the project.

    • In Visual Studio, in the Solution Explorer, right-click the solution name and choose Rename. Provide the new name for your solution.
    • In the Solution Explorer, right-click the project name and choose Rename. Provide the new name for your project.
  5. Rename the namespace used by classes in the project.

    • In the Solution Explorer, expand the project node.
    • Double-click MapViewModel.cs in the Solution Explorer to open the file.
    • In the MapViewModel class, double-click the namespace name (DisplayAMap) to select it, and then right-click and choose Rename....
    • Provide the new name for the namespace.
    • Click Apply in the Rename: DisplayAMap window that appears in the upper-right of the code window. This will rename the namespace throughout your project.
  6. Build the project.

    • Choose Build > Build solution (or press F6).

Get an access token

By default, the sharing level of an item is set to Owner and requires an access token, such as an API key to access it in a client-side application.

  1. Generate an access token according to your ArcGIS account type.

    In your web browser, go to ArcGIS.com and sign in with your ArcGIS Online account.

    1. Click Content > My Content.
    2. Click the New Item > Developer credentials.
    3. In the Create developer credentials window, select API key credentials. Click Next.
    4. Set an expiration date for your API key. API keys can be valid for up to one year. Then, click Next.
    5. In the Privileges menu, check the following privileges:
      • Location services > Basemaps
    6. In the Grant item access menu, click Browse items.
    7. Select the web map you just created. Then, click Next.
    8. Fill out the following properties:
      • Title: API key - Offline app with a web map
      • Tags: offline, offline map, web map, workflow
      • Summary: API key used to access Santa Monica Web Map in an offline app.
    9. Click Next.
    10. Review your selections and, when you are ready, click Next.
    11. Click Generate the API key and go to item details page. I am ready to copy and save the key.
    12. Click Next.
    13. Copy the API key and store it safely. You will not be able to view it again later. If you lose it, you will have to generate another key.
  2. Paste the access token into your code.

    App.xaml.cs
    Use dark colors for code blocks
    27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41
    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
        public partial class App : Application
        {
    
            protected override void OnStartup(StartupEventArgs e)
            {
                base.OnStartup(e);
                // Note: it is not best practice to store API keys in source code.
                // The API key is referenced here for the convenience of this example.
    
                Esri.ArcGISRuntime.ArcGISRuntimeEnvironment.ApiKey = "YOUR_ACCESS_TOKEN";
    
            }
        }
    }

Download and display the offline map

  1. In the Visual Studio > Solution Explorer, double-click MapViewModel.cs to open the file.

  2. Add additional required using statements at the top of the class.

    MapViewModel.cs
    Use dark colors for code blocks
    2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18 18
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    
    using System;
    using System.Collections.Generic;
    using System.Text;
    using Esri.ArcGISRuntime.Geometry;
    using Esri.ArcGISRuntime.Mapping;
    using System.ComponentModel;
    using System.Runtime.CompilerServices;
    using System.Threading.Tasks;
    using Esri.ArcGISRuntime.Portal;
    
    using Esri.ArcGISRuntime.Symbology;
    using Esri.ArcGISRuntime.Tasks.Offline;
    using Esri.ArcGISRuntime.UI;
    using System.Windows;
    using System.Diagnostics;
    using System.Drawing;
    
  3. Get the web map item ID from your ArcGIS Online, for example 8ab76e9c5352400d87ca3315db9ba08e.

  4. In MapViewModel.cs, modify the SetupMap() function to update the web map's item ID to that of the Santa Monica Parcels.

    The existing code creates a PortalItem using the item ID and a Portal referencing ArcGIS Online. It sets the MapViewModel.Map property to a new Map created using the PortalItem.

    MapViewModel.cs
    Use dark colors for code blocks
    55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 55 54 53 52 51 50 49 48 47 46 45 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 58 57 56 55 54 53 52 51 50 49 48 47 46 45 44 43 42 41 40 39 38 37 36 35 34 33 32 31 30 29 28 27 26 25 24 23 22 21 20 19 18 17 16 15 14 13 12 12 12 11 10 9 8 7 6 5 4 2 0 -2 -4 -6 -8 -10 -12 -14 -16 -18 -20 -22 -24 -26 -28 -30 -32 -33 -34 -35 -36 -37 -38 -39 -40 -40 -40
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
            private async Task SetupMap()
            {
                // Create a portal pointing to ArcGIS Online.
                ArcGISPortal portal = await ArcGISPortal.CreateAsync();
    
                // Create a portal item for a specific web map id.
                string webMapId = "YOUR_ITEM_ID"; // Replace with your web map ID
                PortalItem mapItem = await PortalItem.CreateAsync(portal, webMapId);
    
                // Create the map from the item.
                Map map = new Map(mapItem);
    
                // Set the view model "Map" property.
                this.Map = map;
    
  5. In the MapViewModel class, create a new property named GraphicsOverlays. This will be a collection of GraphicsOverlay to display a graphic of the area to take offline.

    Expand
    Use dark colors for code blocks
    33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 54 54 54 54 54 54 54 54 54 54 54 54 54 54 54 54 53 52 51 50 49 48 47 46 45 44 43 42 41 40 39 38 37 36 35 34 33 32 31 30 29 28 27 26 25 24 23 22 21 20 19 18 17 16 15 14 13 12 11 10 9 8 8 8 7 6 5 4 3 2 1 0 -2 -4 -6 -8 -10 -12 -14 -16 -18 -20 -22 -24 -26 -28 -30 -32 -34 -36 -37 -38 -39 -40 -41 -42 -43 -44 -44 -44
    Add line.Add line.Add line.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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
            private Map? _map;
            public Map? Map
            {
                get { return _map; }
                set
                {
                    _map = value;
                    OnPropertyChanged();
                }
            }
    
            private GraphicsOverlayCollection? _graphicsOverlays;
            public GraphicsOverlayCollection? GraphicsOverlays
            {
                get { return _graphicsOverlays; }
                set
                {
                    _graphicsOverlays = value;
                    OnPropertyChanged();
                }
            }
    
    Expand
  6. Modify the SetupMap() function. Use an EnvelopeBuilder to create a new Envelope that defines an area to take offline.

    MapViewModel.cs
    Expand
    Use dark colors for code blocks
    67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 67 68 69 70 71 72 73 74 75 76 77 78 79 80 80 79 78 77 76 75 74 73 72 71 70 69 68 67 66 65 64 63 62 61 60 59 58 57 56 55 54 53 52 51 50 49 48 47 46 45 45 45 44 43 42 41 40 39 38 37 35 33 31 29 27 25 23 21 19 17 15 13 11 9 7 5 3 1 0 -1 -2 -3 -4 -5 -6 -7 -7 -7
    Add line.Add line.Add line.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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Set the view model "Map" property.
                this.Map = map;
    
                // Define area of interest (envelope) to take offline.
                EnvelopeBuilder envelopeBldr = new EnvelopeBuilder(SpatialReferences.Wgs84)
                {
                    XMin = -118.5064,
                    XMax = -118.4800,
                    YMin = 34.0094,
                    YMax = 34.0259
                };
    
                Envelope offlineArea = envelopeBldr.ToGeometry();
    
    Expand
  7. Display a graphic of the area to take offline.

    Use a SimpleLineSymbol and a SimpleFillSymbol to display a new Graphic of the offlineArea with a red outline. Add the graphic to a new GraphicsOverlay and set the MapViewModel.GraphicsOverlays property to display it in the map view.

    MapViewModel.cs
    Expand
    Use dark colors for code blocks
    79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 98 97 96 95 94 93 92 91 90 89 88 87 86 85 84 83 82 81 81 81 80 79 78 77 76 75 74 73 71 69 67 65 63 61 59 57 55 53 51 49 47 45 43 41 39 37 36 35 34 33 32 31 30 29 29 29
    Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                Envelope offlineArea = envelopeBldr.ToGeometry();
    
                // Create a graphic to display the area to take offline.
                SimpleLineSymbol lineSymbol = new SimpleLineSymbol(SimpleLineSymbolStyle.Solid, Color.Red, 2);
                SimpleFillSymbol fillSymbol = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.Transparent, lineSymbol);
                Graphic offlineAreaGraphic = new Graphic(offlineArea, fillSymbol);
    
                // Create a graphics overlay and add the graphic.
                GraphicsOverlay areaOverlay = new GraphicsOverlay();
                areaOverlay.Graphics.Add(offlineAreaGraphic);
    
                // Add the overlay to a new graphics overlay collection.
                GraphicsOverlayCollection overlays = new GraphicsOverlayCollection
                {
                    areaOverlay
                };
    
                // Set the view model's "GraphicsOverlays" property (will be consumed by the map view).
                this.GraphicsOverlays = overlays;
    
    Expand
  8. In the Visual Studio > Solution Explorer, double-click MainWindow.xaml to open the file.

  9. Use data binding to bind the GraphicsOverlays property of the MapViewModel to the MapView control.

    MainWindow.xaml
    Expand
    Use dark colors for code blocks
    17 17 17 17 17 17 17 17 17 17 17 17 17 17 17 17 17 18 19 20 21 21 21 21 21
    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
            <esri:MapView x:Name="MainMapView"
                              Map="{Binding Map, Source={StaticResource MapViewModel}}"
                              GraphicsOverlays="{Binding GraphicsOverlays, Source={StaticResource MapViewModel}}" />
    
    
    Expand
  10. Return to the MapViewModel.cs file and add code to the SetupMap function to create an OfflineMapTask that references the online map by calling the static OfflineMapTask.CreateAsync method.

    MapViewModel.cs
    Use dark colors for code blocks
    96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 96 97 98 99 100 101 101 100 99 98 97 96 95 94 93 92 91 90 89 88 87 87 87 86 85 84 83 82 81 80 79 77 75 73 71 69 67 65 63 61 59 57 55 53 51 49 47 45 43 42 41 40 39 38 37 36 35 35 35
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Set the view model's "GraphicsOverlays" property (will be consumed by the map view).
                this.GraphicsOverlays = overlays;
    
                // Create an offline map task using the current map.
                OfflineMapTask offlineMapTask = await OfflineMapTask.CreateAsync(map);
    
  11. Get default parameters to generate and download the offline map. Modify them to download a read-only offline map.

    MapViewModel.cs
    Use dark colors for code blocks
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Create an offline map task using the current map.
                OfflineMapTask offlineMapTask = await OfflineMapTask.CreateAsync(map);
    
                // Create a default set of parameters for generating the offline map from the area of interest.
                GenerateOfflineMapParameters parameters = await offlineMapTask.CreateDefaultGenerateOfflineMapParametersAsync(offlineArea);
                parameters.UpdateMode = GenerateOfflineMapUpdateMode.NoUpdates;
    
  12. Set a download location for the offline map.

    MapViewModel.cs
    Use dark colors for code blocks
    102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 102 103 104 105 106 107 108 109 109 108 107 106 105 104 103 103 103 102 101 100 99 98 97 96 95 93 91 89 87 85 83 81 79 77 75 73 71 69 67 65 63 61 59 58 57 56 55 54 53 52 51 51 51
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Create a default set of parameters for generating the offline map from the area of interest.
                GenerateOfflineMapParameters parameters = await offlineMapTask.CreateDefaultGenerateOfflineMapParametersAsync(offlineArea);
                parameters.UpdateMode = GenerateOfflineMapUpdateMode.NoUpdates;
    
                // Build a folder path named with today's date/time in the "My Documents" folder.
                string documentsFolder = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
                string downloadDirectory = System.IO.Path.Combine(documentsFolder, "OfflineMap_" + DateTime.Now.ToFileTime().ToString());
    
  13. Create a new GenerateOfflineMapJob using the parameters and downloadDirectory.

    MapViewModel.cs
    Use dark colors for code blocks
    106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 107 108 109 110 111 111 110 109 108 107 107 107 106 105 104 103 102 101 100 99 97 95 93 91 89 87 85 83 81 79 77 75 73 71 69 67 65 63 62 61 60 59 58 57 56 55 55 55
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Build a folder path named with today's date/time in the "My Documents" folder.
                string documentsFolder = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
                string downloadDirectory = System.IO.Path.Combine(documentsFolder, "OfflineMap_" + DateTime.Now.ToFileTime().ToString());
    
                GenerateOfflineMapJob generateJob = offlineMapTask.GenerateOfflineMap(parameters, downloadDirectory);
    
  14. Create a function called GenerateJob_ProgressChanged. This function will respond when the job completes or fails and will track the percent complete as the job runs. Add a try/catch block to handle exceptions and start by getting a reference to the GenerateOfflineMapJob, passed in as the sender argument.

    MapViewModel.cs
    Use dark colors for code blocks
    106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 106 107 108 109 110 111 112 112 112 112 112 113 114 115 116 117 118 119 120 121 122 122 122 122 122 122 122 122 122 122 122 122 122 122 122 122 122 122 122 123 124 125 126 127 128 129 129 129 129
    Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                // Build a folder path named with today's date/time in the "My Documents" folder.
                string documentsFolder = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
                string downloadDirectory = System.IO.Path.Combine(documentsFolder, "OfflineMap_" + DateTime.Now.ToFileTime().ToString());
    
                GenerateOfflineMapJob generateJob = offlineMapTask.GenerateOfflineMap(parameters, downloadDirectory);
    
            }
    
            private async void GenerateJob_ProgressChanged(object? sender, EventArgs e)
            {
    
                try
                {
                    var generateJob = sender as GenerateOfflineMapJob;
                    if(generateJob == null) { return; }
    
                }
                catch (Exception ex)
                {
                    MessageBox.Show($"Error generating offline map: {ex.Message}");
                }
    
            }
    
  15. If the job succeeds, set the MapViewModel.Map property with the offline map result. If it fails, notify the user. If the job is running, write the percent complete to the console.

    MapViewModel.cs
    Use dark colors for code blocks
    121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 121 120 119 118 117 117 117 117 117 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 145 145 145 145 145
    Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.Add line.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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                try
                {
                    var generateJob = sender as GenerateOfflineMapJob;
                    if(generateJob == null) { return; }
    
                    // If the job succeeds, show the offline map in the map view.
                    if (generateJob.Status == Esri.ArcGISRuntime.Tasks.JobStatus.Succeeded)
                    {
                        var result = await generateJob.GetResultAsync();
                        this.Map = result.OfflineMap;
                        Debug.WriteLine("Generate offline map: Complete");
                    }
                    // If the job fails, notify the user.
                    else if (generateJob.Status == Esri.ArcGISRuntime.Tasks.JobStatus.Failed)
                    {
                        MessageBox.Show($"Unable to generate a map for that area: {generateJob?.Error?.Message}");
                    }
                    else
                    {
                        int percentComplete = generateJob.Progress;
                        Debug.WriteLine($"Generate offline map: {percentComplete}%");
                    }
    
                }
                catch (Exception ex)
                {
                    MessageBox.Show($"Error generating offline map: {ex.Message}");
                }
    
  16. Return to your code in SetupMap and assign the GenerateJob_ProgressChanged function to handle the Job.ProgressChanged() event.

    MapViewModel.cs
    Use dark colors for code blocks
    110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 111 112 113 113 112 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                GenerateOfflineMapJob generateJob = offlineMapTask.GenerateOfflineMap(parameters, downloadDirectory);
    
                generateJob.ProgressChanged += GenerateJob_ProgressChanged;
    
  17. Start the generateJob by calling its Start method.

    MapViewModel.cs
    Expand
    Use dark colors for code blocks
    110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 110 111 112 113 114 115 116 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117 117
    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
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
                GenerateOfflineMapJob generateJob = offlineMapTask.GenerateOfflineMap(parameters, downloadDirectory);
    
                generateJob.ProgressChanged += GenerateJob_ProgressChanged;
    
                generateJob.Start();
    
            }
    
    Expand
  18. Click Debug > Start Debugging (or press F5 on the keyboard) to run the app.