Skip to main content

Offline

There are two main kinds of offline functionality: predictive caching and offline regions. Predictive caching is fully automatic and based on the driver’s behavior. It allows offline navigation around the user’s current location, the destination, and the route itself. Offline regions need to be created and loaded ahead of time, enabling routing functionality in non-connected environments.

Predictive caching

To add predictive caching to your application, pass PredictiveCacheOptions instance into the NavigationOptions initializer as you configure a NavigationViewController or manually call NavigationMapView.enablePredictiveCaching(options:).

To add predictive caching using NavigationViewController:

let navigationOptions = NavigationOptions(predictiveCacheOptions: PredictiveCacheOptions())
let navigationViewController = NavigationViewController(for: routeResponse, routeIndex: 0, routeOptions: routeOptions, navigationOptions: navigationOptions)

To add predictive caching using NavigationMapView.enablePredictiveCaching(options:):

if let predictiveCacheOptions = navigationOptions?.predictiveCacheOptions {
navigationMapView?.enablePredictiveCaching(options: predictiveCacheOptions)
}
Map style support for predictive caching

Predictive caching only supports map styles that do not use source compositing. You may need to check your style in Mapbox Studio to make sure source compositing is turned off. Default Mapbox styles (like Mapbox Streets and Mapbox Outdoors) have compositing turned on and will not work with predictive caching by default. To use a Default Mapbox style with predictive caching: 1. Create a new style based on the template style you prefer. 2. Turn off compositing in your style's settings. 3. Publish your style. 4. Reference your style in your application. Predictive caching only supports sources hosted with Mapbox. These sources will have a URL starts with mapbox://.

Configure predictive caching

When predictive caching is enabled, the Navigation SDK will create a cache of data within three configurable boundaries, each with its own default value:

  1. Radius around the user's location. Defaults to 2,000 meters. Use PredictiveCacheOptions.currentLocationRadius to configure this value.
  2. Buffer around the route. Defaults to 500 meters. Use PredictiveCacheOptions.routeBufferRadius to configure this value.
  3. Radius around the destination. Defaults to 5,000 meters. Use PredictiveCacheOptions.destinationLocationRadius to configure this value.

Options for navigation and for maps data caching are configured separately. To configure predictive caching, pass values, in meters, to PredictiveCacheOptions:

var predictiveCacheOptions = PredictiveCacheOptions()

var cacheNavigationLocationOptions = PredictiveCacheLocationOptions()

cacheNavigationLocationOptions.routeBufferRadius = 300
cacheNavigationLocationOptions.currentLocationRadius = 2000
cacheNavigationLocationOptions.destinationLocationRadius = 3000
predictiveCacheOptions.predictiveCacheNavigationOptions.locationOptions = cacheNavigationLocationOptions

predictiveCacheOptions.predictiveCacheMapsOptions.locationOptions.destinationLocationRadius = 300
predictiveCacheOptions.predictiveCacheMapsOptions.zoomRange = 5...12

let navigationOptions = NavigationOptions(predictiveCacheOptions: predictiveCacheOptions)
let navigationViewController = NavigationViewController(for: routeResponse, routeIndex: 0, routeOptions: routeOptions, navigationOptions: navigationOptions)

Estimate predictive caching data use

Data usage depends on the configured radius and the dataset being used. For default Mapbox data, example usage is:

  • Berlin, 15km radius: 136 MB maps, 42 MB navigation
  • Chicago, 15km radius: 74 MB maps, 43 MB navigation
  • London, 15km radius: 145 MB maps, 90 MB navigation
  • Atlanta, 100 miles radius: 659 MB maps, 156 MB navigation

Offline regions

TileStore allows users to create and download offline regions ahead of time, enabling routing functionality in non-connected environments. In areas with no cellular connectivity, or on a device with no SIM card, users can take advantage of turn-by-turn navigation and request new routes. If they go off-route, the Mapbox Navigation SDK can reroute and keep them headed to their destination without requiring network connectivity. TileStore copies the routing data onto the user’s device, so there’s no need to make HTTP API calls for routing information.

TileStore and the Maps SDK

TileStore handles offline regions data for both navigation data for generating routes and map tiles for displaying a map in your application. Find more details on how to use TileStore for map data in the Maps SDK documentation

Initialize TileStore instance

To initialize a TileStore instance, provide a path to a cache directory where tiles will be stored to TileStoreConfiguration.Location and the access tokens for both maps and navigation.

let tileStoreURL = URL(filePath: "path/to/cache/directory/")
let tileStoreLocation = TileStoreConfiguration.Location.custom(tileStoreURL)
let tileStore = tileStoreLocation.tileStore
tileStore.setOptionForKey(TileStoreOptions.mapboxAccessToken,
domain: TileDataDomain.maps,
value: mapToken)
tileStore.setOptionForKey(TileStoreOptions.mapboxAccessToken,
domain: TileDataDomain.navigation,
value: navToken)

Pass TileStore to maps and navigation

After TileStore instance is initialized, pass the TileStoreConfiguration to both NavigationSettings and NavigationMapView via the corresponding options.

TileStore in navigation

For offline and predictive-caching use case, you must pass the same TileStoreConfiguration to the NavigationMapView and the NavigationSettings of Navigation SDK. This will guarantee the same tile regions will be used for both maps-related and navigation-related data.

Pass the TileStoreConfiguration to the NavigationSettings singleton to be applied in navigation:

let tileStoreURL = URL(filePath: "path/to/cache/directory/")
let tileStoreConfiguration = TileStoreConfiguration.custom(tileStoreURL)
NavigationSettings.shared.initialize(directions: NavigationSettings.shared.directions,
tileStoreConfiguration: tileStoreConfiguration)

Pass the TileStoreConfiguration.Location to the NavigationMapView for predictive-caching in maps.

let tileStoreURL = URL(filePath: "path/to/cache/directory/")
let tileStoreConfiguration = TileStoreConfiguration.custom(tileStoreURL)
let navigationMapView = NavigationMapView(frame: frame,
tileStoreLocation: tileStoreConfiguration.mapLocation)

Download a tile region

To download a new tile region or update existing one, create an asynchronous tile region download by calling the tile store's loadTileRegion method and passing in the TileRegionLoadOptions and tile region ID. To create a new tile region, start by defining TileRegionLoadOptions. You must provide at least two pieces of information to TileRegionLoadOptions:

  • geometry: The tile region's associated geometry (for example Polygon or MultiPolygon). Developer may need to import Turf to create one of these types.

  • descriptors: TilesetDescriptor object is a bundle that encapsulates tilesets creation for the tile store implementation. Maps tileset descriptor contains metadata about the tilesets, zoom ranges, and pixel ratio that cached tile packs should include.

let tileRegionId = "tileRegionId"
let tilesetDescriptorOptions = TilesetDescriptorOptions(styleURI: mapStyleURI,
zoomRange: zoomRange,
stylePackOptions: stylePackOptions)
let tilesetDescriptor: TilesetDescriptor = offlineManager.createTilesetDescriptor(for: tilesetDescriptorOptions)
let tileRegionLoadOptions = TileRegionLoadOptions(geometry: geometry,
descriptors: [tilesetDescriptor],
acceptExpired: true)!
tileStore.loadTileRegion(forId: tileRegionId,
loadOptions: tileRegionLoadOptions) { result in
switch result {
case let .success(tileRegion):
handleLoadTileRegionSuccess(tileRegion)
case let .failure(error):
handleLoadTileRegionFailure(error)
}
}

List tile regions

Call the tile store's allTileRegions method to get a list of available tile regions. This will return either an object that includes a list of available tile regions or an error.

tileStore.allTileRegions { result in
switch result {
case .success(let tileStoreRegions):
handleAllTileRegionsSuccess(tileStoreRegions)
case .failure(let error):
handleAllTileRegionsFailure(error)
}
}

Delete tile regions

You can delete a tile region with the tile store's removeTileRegion method.

tileStore.removeTileRegion(forId: regionId)

Observe tile regions state

You can add TileStoreObserver to be notified when the state of any tile region changes.

class CustomTileStoreObserver: TileStoreObserver {
func onRegionLoadProgress(forId id: String, progress: TileRegionLoadProgress) {
// Called whenever the load progress of a TileRegion changes.
}

func onRegionLoadFinished(forId id: String, region: Result<TileRegion, Error>) {
// Called once a TileRegion load completes successfully, or is aborted due to cancellation or errors.
}

func onRegionRemoved(forId id: String) {
// Called when a TileRegion is removed
}

func onRegionGeometryChanged(forId id: String, geometry: Geometry?) {
// Called when the geometry of a TileRegion is modified.
}

func onRegionMetadataChanged(forId id: String, value: Any) {
// Called when the user-provided metadata associated with a TileRegion is changed.
}
}

let tileStoreObserver = CustomTileStoreObserver()
tileStore.subscribe(tileStoreObserver)
Was this page helpful?