1

I am trying to add some 2500 icons (2 Kb each) to a leaflet map. Filling the array is no problem. Adding the layer group to the map, however, takes between 2 and 5 seconds. Any suggestion how to improve the performance?

var icongroup = [];        
for (id in reclist) {
   var recname = reclist[id][0];
   var posn = reclist[id][1];
   var pose = reclist[id][2];
   var mapicon = L.icon({iconUrl: icon, iconSize: [26, 29]});
   icongroup.push(L.marker([posn, pose], {icon: mapicon}));
}
L.layerGroup(icongroup).addTo(map);
Mike
  • 45
  • 2
  • 6

1 Answers1

3

Adding thousands of markers to the page stresses the browser ressources for sure. There is a high chance this is the reason for your delay.

You should consider replacing your markers by a canvas, or clustering them.

See also: Plotting 140K points in leafletjs

Community
  • 1
  • 1
ghybs
  • 47,565
  • 6
  • 74
  • 99