Incomplete map until resize

Hi,

I’m trying to integrate a map in my application following the documentation. And although the code seems right, the map is not fully displayed:

    L.Icon.Default.imagePath = 'vendors/leaflet/images';

    var issuesMap = L.map('map',{
      fadeAnimation: false,
      zoomAnimation: false
    }).setView([51.505, -0.09], 13, {
      reset: true,
      animate: false
    });

    EL.basemapLayer('Topographic').addTo(issuesMap);

As it can be seen, the map is almost empty, just displaying a small tile at the top-left of the screen…

After the resize, the map is fully displayed:

Anyone facing the same problems?

[avizcaino]

Thanks but still not working…

Only managed to make it work using a setTimeout, which use I want to skip at all costs… setTimeout(function(){ issuesMap.invalidateSize()}, 100);

It seems that the invalidateSize() method is running before my map is rendered…

[yohanboniface]

http://leafletjs.com/reference-1.0.0.html#map-invalidatesize is what you need.