How to set view to overlay bounds when overlay added to a map?

467 views Asked by At

I'm loading an overlay ('overlay' in the code below) onto a leaflet base map (openstreetmap) and would like that this overlay completely fills the display window once loaded.

I think I should use getBounds and setView using values gotten through getBounds but didn't manage to make it work.

// initialize the map
  var map = L.map('map').setView([48.85, -3], 15);

  // load a tile layer
    L.tileLayer('https://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png', {
        attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
        minZoom: 3,
        maxZoom: 18,
        subdomains: 'abcd',
        detectRetina : true
    }).addTo(map);    


    //Load overlay

    var overlayOptions = {
            attribution: '...',
            //minZoom: 3,
            maxZoom: 19,
            opacity: 1,
            format: 'image/png',
            detectRetina: true,
            //unloadInvisibleTiles: true,
        };
        overlay = L.tileLayer('https://www.laurentgontier.com/BrehatSHOM/{z}/{x}/{y}.png', overlayOptions).addTo(map);

        //fit map view to overlay bounds
map.fitBounds(overlay.getBounds());

So far, the last line supposed to frame the overlay into the display window doesn't seem to work.

0

There are 0 answers