So navigieren Sie zu einem bestimmten Ort Basierend auf Breitengrad Längengrad

Question

Ich entwickle Beispiel reaktions-native Anwendung, in dieser Anwendung verwende ich react-native-maps. Es funktioniert gut Karten zeigen den aktuellen Standort, aber ich habe benutzerdefinierte Breite Längengrad, jetzt möchte ich zu diesem bestimmten Speicherort navigieren, wenn ich auf einen Button klicken.

Hier Dies ist mein Code:

<MapView 
        ref='map' 
       style={styles.map} 
       region={this.state.mapRegion} 
       showsUserLocation={true} 
       followUserLocation={true} 
       zoomEnabled={true} 
       pitchEnabled={true} 
       showsCompass={true} 
       showsBuildings={true} 
       showsTraffic={true} 
       showsIndoors={true} 
       onRegionChange={this.onRegionChange.bind(this)} 
       onPress={this.onMapPress.bind(this)}> 
      {this.state.markers.length != 0 || this.state.markers != undefined ?(
       this.state.markers.map(marker => (
       <MapView.Marker 
       coordinate={{ 
        latitude: marker.Latitude||this.state.lastLat||region.latitude, 
        longitude:marker.Longitude||this.state.lastLong||region.longitude 
       }} 
       image = { 
        marker.EmergencyService == true ?(
        require('./Imgs/emergencyService.png')): 
        (require('./Imgs/regularService.png')) 
       } 
       onCalloutPress={() => this.bookDoctorsAppointment(marker)} 
     > 
     <MyCustomMarkerView marker={marker} navigator={this.props.navigator}/> 
     </MapView.Marker> 
      )  
     )):(<View></View>)} 
      </MapView> 

Answer 1

Es scheint, dass es eine Reihe von Methoden zur Verfügung stehen, versuche ich animateToRegion unter:

https://github.com/airbnb/react-native-maps/blob/master/docs/mapview.md#methods

versuchen so dass ref mit:

class MyComp extends Component { 
    setMap =() => { 
     if (this.map) { 
      console.log('keys on this.map:', Object.keys(this.map)); 
      this.map.animateToRegion(...); 
     } 
    } 
    getRefMap = el => this.map = el; // this also triggers when <MapView unmounts but el will be `null` so you can test if (el) { alert('mounted') } else { alert('unmounted') } 
    render() { 
     return (
      <View> 
       <Text onPress={this.setMap}>Set map!</Text> 
       <MapView ref={this.getRefMap} ...>; 
      </View> 
     ) 
    } 
}