标签: react-native-map-clustering

我在地图上加载了大约 2000 个标记。它在前几秒钟工作正常，但随后急剧减速。要修复它，我需要清除应用程序数据，然后它只能像以前一样工作几秒钟。

const mapMarkers = [
    {id: 1, code: "603778", lat: 35.761791, lng: 51.389438},
    {id: 2, code: "788621", lat: 35.712278, lng: 51.361785},
    {id: 3, code: "129667", lat: 35.674757, lng: 51.485328},
    {id: 4, code: "999646", lat: 35.772885, lng: 51.446735},
    {id: 5, code: "111524", lat: 35.755656, lng: 51.446774},
    //...
];

let markers = mapMarkers.map(marker => {
    return (<Marker
        key={marker.code}
        coordinate={{latitude: marker.lat, longitude: marker.lng}}
        image={require('./images/markers.png')}
        onPress={() => console.log("pressed")}
    />)
});

我测试了emulator并且physical device两者都有问题。

提示：我将react-native-map-clustering包用于标记集群。

我正在使用react-native-map-clustering对谷歌地图上的标记进行聚类。除指示我的位置的一个标记外，所有标记都是动态的。当我缩小地图时，所有标记都会聚集在一起。但我想要这样的东西 这是我的实现：

<MapView
            layoutAnimationConf={LayoutAnimation.Presets.easeInEaseOut}
            animationEnabled={true}
            ref={mapRef}
            style={styles.map}
            provider={PROVIDER_GOOGLE}
            initialRegion={currentRegion}
            // region={currentRegion}
            clusteringEnabled={true}
            radius={70}
            customMapStyle={mapConfig}>
            <Marker coordinate={currentRegion} title={'my location'}>
                <Image
                    source={images.currentLocation}
                    style={{
                        height: 20,
                        width: 20,
                    }}
                />
            </Marker>
            {branchMarkers()}
        </MapView>