JustFly1984 / react-google-maps-api

React Google Maps API
MIT License
1.75k stars 426 forks source link

Clustering for <OverlayView> or any alternatives to make Clustering for custom markers as it works for native <Marker> #3242

Open snazarov-spacequant opened 1 year ago

snazarov-spacequant commented 1 year ago

Please provide an explanation of the issue

Clustering not working for custom marker wrapped with <OverlayView> component as it works for native <Marker>. Main problem is binding Clustering with custom marker, for example: native marker get props clusterer for this from <MarkerClusterer>

Example of usage:

<MarkerClusterer>
  <OverlayView mapPaneName={layer} position={{ lng, lat }}>
      <div className={styles.marker} onClick={handleClick} onMouseLeave={onMouseLeave} onMouseOver={onMouseEnter}>
          {isDetailed ? (
              <MarkerDetailed blurred={blurred} propType={propType} transaction={transaction} />
          ) : (
              <MarkerShort blurred={blurred} price={price} type={propType} />
          )}
      </div>
  </OverlayView>
</MarkerClusterer>

@react-google-maps/api version @react-google-maps/api": "^2.18.1

How does it behave?

No way to bind <OverlayView> with <MarkerClusterer>

How should it behave correctly?

Should be way to bind <OverlayView> with <MarkerClusterer> or alternatives

mattvb91 commented 11 months ago

Did you manage to make any progress on this? Just looking to implement custom markers but I need to be able to cluster

jkergal commented 2 months ago

Did Anyone find a way to deal with custom markers AND clusturer? Tried to find an alternative but without success :/