[GIS] multiple, simultaneous TileLayers in leaflet

leaflet

I would like to have two tile layers in Leaflet, one a conventional set of tiles, and another composed of PNG tiles with transparency, so basically a tiled overlay layer. Is this possible? I see numerous solutions for multiple tile layers that either show one tile layer or the other, or show one and some zoom levels and one at others, but no solutions that show both tile layers at the same time.

Best Answer

Based on the documentation for the leaflet map object, there's an option for layers. So, the following code should work:

var map = L.map('map', {
    center: [-4, 25],
    zoom: 6,
    layers:[
      L.tileLayer(<base tile url>),
      L.tileLayer(<overlay tile url>)
    ]
});

You can also initialize a map with no tileset data, and add tilelayers later:

var map = L.map('map', {
    center: [-4, 25],
    zoom: 6,
});

var baselayer = L.tileLayer(<base tileset url>).addTo(map);
var topLayer =L.tileLayer(<overlay tileset url>).addTo(map);