0

I have a map with different levels. Each level takes information from a json file and generates the icons with the layer.setIcon method. By dragging the map, the icons disappear when are outside the displayed area. Why?

enter image description here

EDIT: Okay, I think I see the problem here: Leaflet.MarkerCluster.LayerSupport Without this extension, rendering works... why?

Daniele
  • 41
  • 6

1 Answers1

0

That is the default behaviour of Leaflet.markercluster plugin, especially visible on mobile.

More specifically, it has a removeOutsideVisibleBounds option that is enabled by default:

removeOutsideVisibleBounds: Clusters and markers too far from the viewport are removed from the map for performance.

On mobile, anything outside the current map viewport is removed, and re-appears when panning stops. But this means that during pan, you may miss some markers.

See also Leaflet MarkerCluster removeOutsideVisibleBounds not working

Unfortunately, there is no API to customize this behaviour, other than disabling it by passing the option to false:

const mcg = L.markerClusterGroup({
    removeOutsideVisibleBounds: false // Disable default behaviour
}).addTo(map);

Demo on mobile: https://jsfiddle.net/4weocd0q/1/embedded/#Result

ghybs
  • 47,565
  • 6
  • 74
  • 99
  • Unfortunately even with the parameter set to `false` the problem remains. – Daniele Feb 13 '21 at 12:43
  • For me the problem is the extension MarkerCluster.LayerSupport. – Daniele Feb 15 '21 at 13:51
  • 1
    Probably worth making it a separate question, then. With an [MCVE](https://stackoverflow.com/help/minimal-reproducible-example) to make sure the problem is reproducible with details provided in the question. – ghybs Feb 15 '21 at 15:03