Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

LeafletJS not loading all tiles until moving map

I am trying to load a simple leaflet map in my Ionic 2 app. Unfortunately not all tiles are loaded currectly until a moving the map.

this.map = new L.Map('mainmap', {
      zoomControl: false,
      center: new L.LatLng(40.731253, -73.996139),
      zoom: 12,
      minZoom: 4,
      maxZoom: 19,
      layers: [this.mapService.baseMaps.OpenStreetMap],
      attributionControl: false
    });

enter image description here

like image 501
rakete Avatar asked Aug 08 '16 14:08

rakete


1 Answers

this work for me fine :

this.map = L.map('map');
const self = this;
    
this.map.on("load",function() { setTimeout(() => {
   self.map.invalidateSize();
}, 1); });
    
this.map.setView([36.3573539, 59.487427], 13);
like image 68
HamidReza Avatar answered Sep 27 '22 17:09

HamidReza