CODEWITHSUNDEEP
react-nativereact-native-maps
HungrySoul
HungrySoul

Reputation: 1231

How to zoom into a specific lat lon on starting of maps in react-native-maps?

I'm using react-native-maps and I want to zoom to a specific lat lon location when i init my maps in my react native project. I heard that it is called as camera zoom but couldn't find anything that could help me with this problem. and also it must fit to all the markers on the map.

Any lead would be greatly appreciated...

Upvotes: 0

Views: 5820

Answers (2)

Patrick R
Patrick R

Reputation: 6857

Use the following code:

componentDidMount() {
       var newRegion = {
            latitude: LATITUDE,
            longitude: LONGITUDE,
            latitudeDelta: LATITUDE_DELTA,
            longitudeDelta: LONGITUDE_DELTA,
      };
      this.mapView.animateToRegion(newRegion, 1000);
}

MapView:

<MapView
          provider={PROVIDER_GOOGLE}
          style={styles.map}
          initialRegion={this.state.region}
          zoomEnabled={true}
          minZoomLevel={10}
          ref={ref => { this.mapView = ref }}>
</MapView>

Upvotes: 2

Dip Halani
Dip Halani

Reputation: 11

By specifying latitudeDelta , longitudeDelta and marker array, you can zoom in. see props of react native maps for more information.

Upvotes: 1

Related Questions