17
votes

Is there a way to use Mapbox GL (asking about both JS and native) in an offline setting? With MBTiles, you could use either the MBTiles file or extract the raster images. I'm wondering if there's anything similar that would allow Mapbox GL to load the data from a local source as opposed to requiring a web connection to Mapbox's servers. Not talking about just caching data for when the user is offline but actually making a map that runs purely offline all the time. Thanks.

4

4 Answers

17
votes

A sample of MapBox GL JS offline (completely hosted on a custom server, in this case GitHub gh-pages) is visible at:

http://klokantech.github.io/mapbox-gl-js-offline-example/

The javascript, css, fonts and even the pre-rendered vector tiles unpacked from MBTiles may be simply in a directory and you get the zoomable vector map.

In case you want to host MBTiles with the vector or raster tiles somewhere online for free, easiest is probably: https://github.com/klokantech/tileserver-php/

While playing with the vector tiles I documented most of the use-cases in these two repos:

3
votes

Not yet, but this is on the development roadmap for native, at least:

https://github.com/mapbox/mapbox-gl-native/issues/584

It's trickier with JavaScript in the browser, not not really a core use case, but could maybe be done.

3
votes

You can find an example project of prepackaged/offline maps for iOS here:

http://github.com/jaysquared/mapbox-gl-ios-offline-example

I basically just run a webserver within the iOS app and serve the tiles. Works for vector and image tiles.

2
votes

MBTiles can be displayed in the Mapbox Maps iOS SDK by hosting a web server within your app and pointing the map to localhost. I've posted my solution here:

https://gist.github.com/namannik/3b7c8b69c2d0768d0c2b48d2ed5ff71c

The difference between this solution and the one posted by @jaysquared.com is that this solution doesn't require a style.json.