[closed] Offline OpenStreetMap

Question

I have a website with a working map using leaflet and open street map. I now would like to make this work on my pc offline so I can show people, without needing an internet connection. I am only showing a small section of the world and the user doesn't need to move much.

My code for loading the map tile is as follows:

var openStreetMap = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { minZoom: 14, maxZoom: 20 });

I suspect want something like the following - but if there's an easier way to load the map offline let me know!

var openStreetMap = L.tileLayer('http://{s}.localhost/{z}/{x}/{y}.png', { minZoom: 14, maxZoom: 20 });

Accepted Answer

5

This works even without a local webserver. Just use an URL like

file:///home/jonh/openstreetmap/{z}/{x}/{y}.png

given that your files are located under /home/jonh/openstreetmap/. You can also download a specific area using Marble and directly access its offline cache, e.g. with the URL

file:///home/jonh/.local/share/marble/maps/earth/openstreetmap/{z}/{x}/{y}.png

But keep the tile usage policy in mind when downloading tiles for an area.

permanent link

answered 02 Oct '13, 06:25

scai ♦
33.3k●21●309●459
accept rate: 23%

3

If you want to produce tiles for a small area, you could use Maperitive for that.

(02 Oct '13, 06:44) Frederik Ramm ♦

1

Marble is the easiest way, just zoom into the area and it will cache the tiles, One could also download a section and load it up in JOSM, Merkaartor or even load the .osm file in Marble.

(03 Oct '13, 14:41) redsteakraw

1

Thanks guys, it's working for me - I had to change the leaflet script as per here also 'http://stackoverflow.com/questions/18695623/leaflet-gmapcatcher-change-zxy-template'. GMapCapture put the files into C:\Users\username.GMapCatcher\tiles and I included them in a folder in my web apps images directory.

(04 Oct '13, 03:23) JohnH

Hi. I have this url L.tileLayer( 'http://{s}.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', how can change it and use it for local. And use map Offlien.

(29 Oct '15, 12:52) Developer7

1

Which part of my answer is unclear to you?

(29 Oct '15, 14:38) scai ♦

Does this very old example help?

https://github.com/SomeoneElseOSM/OSMembedded/blob/master/Scripts/leaflet_embed.js

Please don't use that other than as an example (at least not without updating Leaflet). There are surely better ways to do "offline maps" now though (canned vector offerings from Mapbox is one possibility).

(29 Oct '15, 15:11) SomeoneElse ♦

My code is this L.tileLayer( 'http://{s}.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', when i try to change it for loacly and use map in offline mod it not works,maybe i take wrong phat?

(30 Oct '15, 09:42) Developer7

1

We can't know without you providing more details. You could also check your browser's developer console. And ideally ask a new question about your issue.

(30 Oct '15, 20:24) scai ♦

i cant solve my problem. can you make video from this tutorial? i need that. plz help me

(22 May '19, 08:42) mr jacki chan

showing 5 of 9 show 4 more comments

[closed] Offline OpenStreetMap

The question has been closed for the following reason "Closed to prevent questions from help vampires" by Richard 22 May '19, 10:34

Follow this question

Related questions