Как сгруппировать все маркеры, кроме одного - PullRequest
Новая
       7

Как сгруппировать все маркеры, кроме одного

1 голос
/ 14 июля 2020

Я использую response-native-map-clustering для кластеризации маркеров на карте Google. Все маркеры имеют динамический c, кроме одного, который указывает мое местоположение. Когда я уменьшаю масштаб, карта объединяет все маркеры. Но я хочу что-то вроде этого введите описание изображения здесь Вот моя реализация: 

<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>

1 Ответ

1 голос
/ 20 июля 2020

Вы можете установить опору cluster на маркере на false вот так: 

<Marker
  coordinate={coordinate}
  cluster={false}
  ...
/>
  <Image ... />
</Marker>

Таким образом, этот маркер будет постоянно декластерирован и виден на карте на всех уровнях масштабирования, не затрагивая другие кластеры. Внутренне, для каждого Marker , который является дочерним по отношению к MapView , проверка того, должен ли этот Marker быть включен в кластер, выполняется в помощнике . функция , которая проверяет, было ли переопределено это свойство: 

export const isMarker = (child) =>
  child &&
  child.props &&
  child.props.coordinate &&
  child.props.cluster !== false;

Примечание для пользователей TypeScript:

response-native-map-clustering не экспортирует Marker компонент с определенным кластером проп. Применение кластерного свойства к Marker , импортированному из react-native-maps, вызовет ошибку компилятора ts, поэтому вам нужно будет определить свой собственный тип маркера или проигнорировать эту ошибку ts.

...