自定义标记图像会响应本地地图框

Question

我在项目中实现了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>