Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Get all markers in a cluster when a cluster is pressed #1122

KalebMatthews opened this issue Mar 17, 2018 · 4 comments


Copy link

commented Mar 17, 2018

Is there any way to get all GeoJSON features in a cluster when the cluster marker is pressed with an onPress listener on the ShapeSource?

If not then a good enhancement would be to return a FeatureCollection in that scenario or an array of the Feature ids in the properties of the cluster Feature. This is the only thing missing from this package that is preventing me from using it in my current project. Timely assistance is greatly appreciated.



This comment has been minimized.

Copy link

commented Mar 19, 2018

I have found a solution to this. For all those who run into this issue, you can easily implement SuperCluster to handle the clustering for you. You will have to create your normal GeoJSON object and pass those into SuperCluster then you can use SuperCluster to get all children needed by using their functions. It integrates very nicely with Mapbox's ShapeSource.

Closing this issue since a solution was found.


This comment has been minimized.

Copy link

commented Nov 1, 2018

hi @KalebMatthews ,
Any chance you could show how to integrate supercluster to react-native-mapbox-gl please ?


This comment has been minimized.

Copy link

commented Nov 2, 2018

I actually moved to react-native-maps with Supercluster for clustering. I can not remember the reason but I remember this package missing something I needed desperately.

However, to add supercluster to this project you simply have to use the Shape source with the geojson generated by supercluster. The supercluster function GetCluster(bbox, zoom) returns an array of geojson objects. You can pass those into the Shape source to generate the makers you need. You will need to create the first layer of the geojson object and add the clustered geojson object to that parent object then you can add it to the Shape source easily.

You need to create a FeatureCollection of Points (FeatureCollection) for the proper geojson objects. Feature Collections is an object that contains a type ('FeatureCollection') and an array of features which is where the output from GetCluster should be loaded into. You can then modify the icon depending on if the feature has the cluster (boolean) flag set or not.

You then have to modify the code to detect the zoom level when it changes and recalculate the markers that are needed at that zoom level. If you notice the supercluster getCluster function has a zoom level argument so it's super easy to modify to get the new geojson list.

I am pretty sure I remembered all of that correctly but I could have missed something. Sorry I no longer have the old code to reference.


This comment has been minimized.

Copy link

commented Sep 12, 2019

For others who might find this, I recently implemented Supercluster to gain access to the underlying point information. Granted, we're using @react-native-mapbox-gl/maps but the approach should be similar. You can read about it at Supercluster with @react-native-mapbox-gl/maps

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
3 participants
You can’t perform that action at this time.