utilise l'image distante uri dans les cartes-réact-natives MapView

Question

J'utilise react-native-maps pour mon application native-réagissante. Je dois poster une image sur MapView sur la carte. Mais, je reçois une image du web. Considérant que, comme je sais que seules les images locales peuvent être ajoutées à Mapview dans les cartes de réaction-native. Savez-vous un moyen d'afficher l'image de uri dans le react-native-maps MapView?

J'ai essayé avec

<MapView style={{flex: 1}} 
       loadingEnabled={true} 
       region={this.state.region} 
       onRegionChangeComplete={this.onRegionChangeComplete}> 

       <MapView.Marker 
        coordinate={{latitude: this.props.user_location[0], longitude: this.props.user_location[1]}} 
        title={this.props.user_name} 
        description={this.props.user_desc}> 
        <Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} /> 
       </MapView.Marker> 

      </MapView> 

et le résultat est

Et puis je viens de supprimer le <Image/> avec

<MapView style={{flex: 1}} 
       loadingEnabled={true} 
       region={this.state.region} 
       onRegionChangeComplete={this.onRegionChangeComplete}> 

       <MapView.Marker 
        coordinate={{latitude: this.props.user_location[0], longitude: this.props.user_location[1]}} 
        title={this.props.user_name} 
        description={this.props.user_desc}> 
       </MapView.Marker> 

      </MapView> 

et le résultat est

Answer 1

vous pouvez essayer custom marker view

<MapView.Marker coordinate={marker.latlng}> 
    <Image source={{uri: 'http://someCustomImageURL' }} /> 
</MapView.Marker> 

Answer 2

Je trouve le chemin.

En fait, j'ai utilisé Native-Base dans mon application. Ainsi, le composant Thumbnail est importé de Native-base.

Code Ma est comme

<MapView style={{flex: 1, justifyContent: 'space-between'}} 
       loadingEnabled={true} 
       region={this.state.region} 
       onRegionChangeComplete={this.onRegionChangeComplete}> 

       <MapView.Marker 
        coordinate={{latitude: this.props.user_location[0], longitude: this.props.user_location[1]}} 
        title={this.props.user_name} 
        description={this.props.user_desc}> 
        <View> 
         <Text><Thumbnail source={{uri: this.props.user_photo}} /></Text> 
        </View> 
       </MapView.Marker> 

      </MapView>