0

I am using leaflet to display maps on web site.
I have a known region and known path on that region that I display.
But now I have a requirement to allow viewing that map offline.

My question is do I need to create native app for mobile and in web view display map to do this or this is somehow possible by using JavaScript?

I am using mapbox for map.

1110
  • 7,801
  • 45
  • 156
  • 303

2 Answers2

1

You can do this with Javascript and Mapbox/Leaflet.

For iOS at least you can package your javascript app for mobile with a tool like PhoneGap.

The bigger question in my mind is whether you map relies on a mapping/tile service for your base maps (or your overlays).

If that is the case, then the answer gets a little more complicated. (You could potentially package a few zoom levels of tiles with your app, but that either limits the amount of zooming or the amount of panning that a user will be able to do).

If, on the other hand, you are not using a web mapping service for any of your layers (maybe all your layers are Vector/GeoJSON), then creating an offline map will be just as easy as creating any other offline app.

sfletche
  • 36,606
  • 25
  • 86
  • 108
  • Do you know some resource where I can see how I can make this? I just need to display map and load coordinates from JS to draw path based on coordinates. I already have all this just need to make it offline but can't find any good resource. – 1110 May 31 '14 at 18:22
  • what are you struggling with? the mapping portion? or packaging the app for offline mobile? – sfletche May 31 '14 at 18:32
  • Package map for offline mibile. Have no idea how to make it :-( – 1110 May 31 '14 at 22:06
  • This might help http://stackoverflow.com/questions/14113278/storing-image-data-for-offline-web-application-client-side-storage-database – Marko Letic May 31 '14 at 23:11
1

For displaying OpenStreetMap offline you will either need pre-rendered raster images (tiles) which you will create beforehand, or you have to put raw or pre-processed data onto your device and render you map during runtime.

The first option requires more space on the device for storing the tiles, but displaying them will be faster. And there is already lots of rendering software available for creating the tiles.

The second option requires more processing power on the device to render the map and you will need some application which does the rendering on the device, but the resulting map data can be a lot smaller compared to the pre-rendered tiles.

Skim through the OSM wiki which has various information about mobile software. I suggest to take a look at already existing solutions in order to get an idea about the various possibilities.

scai
  • 17,888
  • 3
  • 49
  • 66
  • If I decide to store tiles in phone do I need to use software like phone gap? – 1110 Jun 01 '14 at 10:06
  • I've never heard of *phone gap*. You will need an application that is able to display tiles. Take a look at *osmdroid* and possibly the *osmbonuspack*. – scai Jun 01 '14 at 11:46
  • For tiles you can also use leaflet with a webview e.g. on Android (maybe phone gap has this abstracted for other platforms too). For vector data I suggest to look into mapsforge although there is no good clone on iOS. – Karussell Jun 12 '14 at 07:36