反応ネイティブマップでリモートイメージURIを使用するMapView

Question

反応ネイティブアプリケーションにreact-native-mapsを使用しています。マップ上のMapViewに画像を投稿する必要があります。しかし、私はウェブからイメージを取得します。一方、私が知っているように、地元の画像だけが反応ネイティブマップでMapviewに追加できます。 react-native-maps MapViewにuriの画像を投稿する方法はありますか？

私は

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

にしようとした結果が

され、その後、私はちょうど

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

で<Image/>を削除し、その結果が

です10

Answer 1

私は道を見つけるcustom marker view

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

Answer 2

を試すことができます。

実際、私は自分のアプリケーションでネイティブベースを使用しました。したがって、コンポーネントThumbnailはネイティブベースからインポートされます。

私のコードは

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