search

JiriHoffmann / react-native-clusterer

React Native clustering library using C++ Supercluster implementation
MIT License
159 stars 20 forks source link

Disable clustering. #11

Closed schriker closed 2 years ago

schriker commented 2 years ago

Hi, first of all, thank you for this project it works great! Just want to ask if there is an option to disable clustering? For example at some zoom level when the user zooms very close I would like to display all markers no matter how many there are.

I'm trying to play around with maxZoom and minZoom options, but can quite there.

JiriHoffmann commented 2 years ago

Hi! Sorry, no there is currently no way to disable clustering completely. You could probably conditionally render clusters/markers using this function:

export const getBoundsZoomLevel = (bounds: BBox, dims: MapDimensions, maxZoom: number) => {

  function latRad(lat: number) {
    const sin = Math.sin((lat * Math.PI) / 180);
    const radX2 = Math.log((1 + sin) / (1 - sin)) / 2;
    return Math.max(Math.min(radX2, Math.PI), -Math.PI) / 2;
  }

  function zoom(mapPx: number, worldPx: number, fraction: number) {
    return Math.floor(Math.log(mapPx / worldPx / fraction) / Math.LN2);
  }

  const latFraction = (latRad(bounds[3]) - latRad(bounds[1])) / Math.PI;
  const lngDiff = bounds[2] - bounds[0];
  const lngFraction = (lngDiff < 0 ? lngDiff + 360 : lngDiff) / 360;
  const latZoom = zoom(dims.height, dims.height, latFraction);
  const lngZoom = zoom(dims.width, dims.width, lngFraction);

  return Math.min(latZoom, lngZoom, maxZoom);
};

With the combination of this one: https://github.com/JiriHoffmann/react-native-clusterer/blob/fe689b6cc2060ee0d5a38e86af0e79ef6789adc4/src/utils.ts#L15-L27

ghost commented 2 years ago

Can I get more clarity on how to use the above function? My issue is when markers from a cluster are too close to each other, the cluster does not explode and show markers when zooming in to fullest.

By the way, this library is awesome. Thank you @JiriHoffmann.

devransimsek commented 1 year ago

Can I get more clarity on how to use the above function? My issue is when markers from a cluster are too close to each other, the cluster does not explode and show markers when zooming in to fullest.

By the way, this library is awesome. Thank you @JiriHoffmann.

Hi, Did you solve this problem? I can't see the markers when they are too close to each other.