I want to integrate maps in my react-native app, I am using the “react-native-maps” library for that
https://github.com/airbnb/react-native-maps
I want to use clustering but I am unable to find proper documentations related to that.
Please help me to find documentation of how to integrate maps with clustering and also tell which library is best for the implementation of clustering for both platforms, iOS and Android.
解决方案
You can use mapbox/supercluster repo, and here's a gist showing how to implements supercluster to React Native. It's initially developed for browser/node applications but you can still simply npm install and use it (javascript is javascript everywhere). Add the clustered markers into your MapView (originally shared here):
{ this.map = ref; }}>
{ this.state.markers.map((marker, index) => {
return (
coordinate={{ latitude: marker.geometry.coordinates[1], longitude: marker.geometry.coordinates[0] }}
onPress={() => this.markerPressed(marker)}>
);
})}
Warning from an issue of react-native-maps:
The major issue is performance, if you need to display hundreds or
thousands of markers you're gonna have to optimize the hell out of it,
and this is where it gets really hard.
react-native-maps also have an active conflicting PR which solves this issue both in Android and iOS natively, but it waits for a merge. However, you can manually implement it.