Leaflet with offline maps?

Showing 1-8 of 8 messages
Leaflet with offline maps? Pete 10/9/12 1:45 AM
Hi,
is it possible to use leaflet with offline maps?

PeteA
Re: Leaflet with offline maps? MathieuB 10/9/12 5:14 AM
Yeah totally, just change the path used for the tiles, to the local path.

Ex .: 
Default =
// add a CloudMade tile layer with style #997 L.tileLayer('http://{s}.tile.cloudmade.com/[API-key]/997/256/{z}/{x}/{y}.png', { attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>' }).addTo(map);

Offline =
L.tileLayer('file://path_to_your_tiles/{z}_{x}_{y}.png', { attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>' }).addTo(map);

Just make sure your tiles are named on the same pattern (ex.: 6_17_15.png). You can change the pattern to.
Re: Leaflet with offline maps? Chris Hill 10/9/12 7:45 AM
You can store map tiles locally using a directory structure to match the server one and point your tileLayer at the local location of the tiles. One thing to bear in mind though, some providers of map tiles will get upset if you scrape their tiles en-masse to then store locally. They will get especially upset if you write an app that encourages lots of people who use the app to do this. Such an app is likely to quickly get blocked. See http://wiki.openstreetmap.org/wiki/Tile_usage_policy for example. You can always render your own tiles to hold locally.
Re: Leaflet with offline maps? Suma Subbarao 11/27/13 8:15 AM
Has anyone had success using this approach within an Android app? An android app launching leaflet with Webkit? It works connecting to the net, but not with the offline tiles:

//this works, but is online:
/*
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18
}).addTo(map);
*/
// None of the approaches to reference the downloaded png tiles work...I have tried adding the tiles to assets directory in my app and also directly onto the device's internal storage.
//L.tileLayer('filesystem:http://127.0.0.1/Tiles/Mapnik/{z}/{x}/{y}.png', {
L.tileLayer('map/Mapnik/{z}/{x}/{y}.png', {
maxZoom: 10
}).addTo(map);

Anybody had success with this?
Thanks.
Re: Leaflet with offline maps? JaVaWa 11/29/13 5:40 PM
You can't use http://127.0.0.1/, unless your device has a webserver running. Just use a relative or absolute path without the http prefix.
Re: Leaflet with offline maps? Suma Subbarao 12/4/13 1:02 PM
Thanks. This below worked for me:

L.tileLayer('file:///android_asset/map/Mapnik/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);




On Friday, November 29, 2013 8:40:38 PM UTC-5, JaVaWa wrote:
You can't use http://127.0.0.1/, unless your device has a webserver running. Just use a relative or absolute path without the http prefix.
Re: Leaflet with offline maps? stefanus eko 3/2/14 10:46 PM
Hi i am try what you try, but in my case, it's not work .. in console display an error "Not allowed to load local resource: file://map/12/3266/2119.png"  ..
why this is happening to me?? 
Re: Leaflet with offline maps? aston...@gmail.com 3/3/14 1:12 AM
Just quickly looking, there are three forward slashes (///) in Suma Subbarao's file: statement, and only two in yours...


On Sunday, March 2, 2014 10:46:04 PM UTC-8, stefanus eko wrote:
Hi i am try what you try, but in my case, it's not work .. in console display an error "Not allowed to load local resource: file://map/12/3266/2119.png"  ..
why this is happening to me??