Пользовательские изображения маркеров реагируют на родную карту - PullRequest
0 голосов
/ 27 сентября 2018

Я реализовал react-native-mapbox-gl в моем проекте.Я хочу сделать пользовательские маркеры с изображениями, поступающими с сервера, я видел примеры с определением объекта таблицы стилей MapBox, но я не могу сделать это динамически, когда есть массив маркеров и изображений.Ниже приведен фрагмент кода, показывающий, как это делается с одним изображением, но я хочу сделать это с массивом маркеров и изображений.Любая помощь будет оценена.

const layerStyles = MapboxGL.StyleSheet.create({
  icon: {
    iconAllowOverlap: true,
    iconIgnorePlacement: true,
    iconSize: Platform.OS === 'android' ? 1 : 0.5,
    iconOffset: [0, 5],
    textField: '{discountPercentage}%',
    textSize: 14,
  },
  iconPremium: {
    iconImage: markerPremium,
    textColor: '#fff',
    textHaloColor: '#fff',
    textHaloWidth: 0.3,
  },
  iconPremiumSelected: {
    iconImage: markerPremiumSelected,
    textColor: '#D7B218',
    textHaloColor: '#D7B218',
    textHaloWidth: 0.1,
  },
});

<MapboxGL.ShapeSource
          id="premiumOffers"
          shape={{
            type: 'FeatureCollection',
            features: this.state.markers,
          }}
          cluster
          clusterMaxZoomLevel={14}
          clusterRadius={50}
          onPress={(e) => {
            const { offerId, restaurantId } = e.nativeEvent.payload.properties;
            if (offerId) this.props.selectMarker(offerId, restaurantId);
          }}
        >
          <MapboxGL.SymbolLayer
            id="singlePoint"
            filter={['all', ['!has', 'point_count'], ['==', 'isSelected', false]]}
            style={[layerStyles.icon, layerStyles.iconPremium]}
          />

  </MapboxGL.ShapeSource>
...