Offline maps in PhoneGap using OpenLayers and TileCache

Is there a good tutorial on how to pre-cache a known part of a map using TileCache, store them in the PhoneGap mobile application database and load them using OpenLayers?

I went through a lot of tutorials, and yet I did not understand how to do all this together.

+6
source share
1 answer

If you have your own tiles and their built-in applications in your archive, you can use the Flyer to visualize local fragments. http://leafletjs.com/
If your custom tiles are deleted (hosted on the server), you still cannot use them offline.
Please view this blog.

Yes, it is completely possible to use flyers offline, just change the path used for tiles to a local path.

Example:
The default value is:

// 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' }).addTo(map); 

Offline:

 L.tileLayer('file://path_to_your_tiles/{z}{x}{y}.png', { attribution: 'Map data' }).addTo(map); 

Just make sure your tiles are named after one pattern (for example: 6_17_15.png). You can change the template to.

You can store map fragments locally using the directory structure to match the server one, and point your tileLayer to the local fragment location. It’s one thing to keep in mind, however, some map tile providers will be frustrated if you clean your en-masse tiles and then save them locally. They will be especially upset if you write an application that encourages a lot of people who use the application to do this. Such an application is likely to quickly block. See http://wiki.openstreetmap.org/wiki/Tile_usage_policy , for example. You can always display your own tiles for local storage.

+1
source

Source: https://habr.com/ru/post/909631/


All Articles