Menu
I've been using leaflet.js to render maps like it is shown in leaflet getting started page:
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { ...
I've download a .osm file (map.osm) from openstreetmap and I'm triying to figure our how can I use this file from leaflet like:
L.tileLayer('file:///./map.osm/{z}/{x}/{y}.png/{z}/{x}/{y}.png', { ...
In other cases I've used Mobile atlas creator to download map layer and use them in leaflet. It downloads selected maps in a directory structure like zoom - x - y .png files (like: file_system\local_maps_dir\13\4049\2999.png where 13 is zoom latitude 4049 and longitude 2999).
But now I need to load or use these .osm files with leaflet.
Is there any way to do this? Do I need to convert this .osm file?
Thanks everyone for your time.
379
The Leaflet JavaScript. Our initial JavaScript is pretty straightforward. All we are doing here is creating the map and adding a tile layer. The tile images are coming from the OpenStreetMap servers which are good for testing.
Leaflet doesn't support vector tiles by default. For basemaps, it is recommended to use it with traditional raster tiles (Mercator XYZ). Such tiles can be generated on demand for any of the GL styles with the open-source server software called TileServer GL.
Check the master branch for the published 2. x version! This library can be used to create maps, which are still available when you are offline and are fast when your connection is not. It works in the browser or can be used in an mobile app based on html and in progressive webapps.
You can't. Leaflet requires raster tiles whereas a .osm (or .pbf) file contains raw vector data. In order to produce raster tiles out of vector data you have to render it. This can't be done by Leaflet directly but requires external tools instead.
Rendering tiles locally can be done for example by using Maperitive or TileMill. You might need another step for extracting individual tiles from the produced MBTiles.
192
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
