block by ThomasG77 5ccb92134a2e2dbf78874cebd9ecff48

Use GDAL2Tiles to view images in Leaflet

Full Screen

Recipe for GDAL2Tiles


Clone the repository

git clone leaflet-gdal2tiles
cd leaflet-gdal2tiles

Get the sample data

# If you have wget
wget -O btv1b53095142n_f1.jpg
# Else if you have CURL
curl -o btv1b53095142n_f1.jpg
# else if no wget, no CURL, open in a browser
# and save file as btv1b53095142n_f1.jpg

Process the data -p raster btv1b53095142n_f1.jpg tiled/
# If version of GDAL >= 2.3.x, to run in parallel --processes=4 -p raster btv1b53095142n_f1.jpg tiled/

FIY, the center we use to set the center is by default [0, 0]. To determine, min and max zooms, see directory names in tiled folder. They are number the min is 0 and the max is 6. These numbers are useful to change minZoom and maxZoom options in Leaflet sample code index.html when using this recipe for your own images.

Serve files using http-server (Node.js based)

See link about “Learn how to serve local files with “localhost” using one liners” in Prerequisites section and run the following :


Open your browser at http://localhost:8080 to see the following:

Image capture

You can see also see the live demo