[GIS] Leaflet with custom map (CRS) – how to convert JPG to TileLayer tiles

coordinate systemleaflettile-layer

I have a JPG file with a map which isn't in a real scale, and can't be represented by real geographical latitude and longitude, so I so the Leaflet CRS solution and this seems like the way to go.

The problem is that the map file (JPG) size is ~30MB and can't be loaded in a single request, so I read a bit more and found the TileLayer solution.
I even found a demo .

Now, my only problem is how can I take the JPG file and convert it to layers? Is there an online / offline tool for that?
As far as I understand, all I need is to split the large image to 256px x 256px tiles, place it in directories in my server and TileLayer will do the rest?

Best Answer

I'm looking for a similar solution. Sharing what all I've found from a web search. Yet to implement, but check them out and have a go. I searched on duckduckgo for "cut image into tiles for leaflet"

Found:

http://blog.mastermaps.com/2013/06/showing-zoomify-images-with-leaflet.html
Showing Zoomify images with Leaflet - by Bjørn Sandvik. It'll be best to take the code from one of his examples and adapt it. And he's using this: http://www.zoomify.com/free.htm He's made a leaflet plugin to enable using tileset prepared by Zoomify: https://github.com/turban/Leaflet.Zoomify

Then, more stuff:

http://leafletjs.com/plugins.html#non-map-base-layers leaflet plugins for non-maps This lists the zoomify plugin mentioned above, and more options too:

https://github.com/alfarisi/leaflet-deepzoom leaflet plugin for Deepzoom images. https://www.microsoft.com/en-us/download/details.aspx?id=24819 Deep Zoom composer : windows app for generating tiles

This plugin seems to have the most complete solution, with a shell and python script to generate the image tiles: https://github.com/commenthol/leaflet-rastercoords
It uses a script, "gdal2tiles.py" to generate the tiles. https://github.com/commenthol/gdal2tiles-leaflet Usage example: command for an image whose larger dimension is 3000px:

python ./gdal2tiles.py -l -p raster -z 0-4 -w none karta.jpg tiles

there's a shell command for calculating the zoom extents (0-4 or 0-3 etc):

$ echo "l(3000/256)/l(2)" | bc -l

Update: An article/walkthrough where the author has tiled a very large image successfully and has a demo to show of it: https://medium.com/@jarednielsen/how-to-make-an-interactive-story-map-using-leaflet-and-non-geographical-images-821f49ff3b0d

Related Question