How to navigate to Particular location Based On Latitude Longitude - react-native

Question

I am Developing sample react-native Application, in that application i am using react-native-maps. It's Working fine maps showing current Location, But ,I have Custom latitude Longitude,now I want to navigate to that particular location when i click a Button.
Here This is My 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

It seems there are a bunch of methods available, I try animateToRegion below:
https://github.com/airbnb/react-native-maps/blob/master/docs/mapview.md#methods
So try using that ref:
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>
)
}
}