react native - Set the bounds of a mapView -

i have app calls api , returns list of locations.

once data returned, convert json map points annotations.

these added ma no problem.

the problem running setting bounds of map. can't seem figure out.

the code have is.

_handleresponse(response) {                    var locations = [];      // loop through repsone , add items arra annotations      (var = 0; < response.length; i++) {          // location          var location = response[i];          // parse co ords          var lat = parsefloat(location.latitude);          var lng = parsefloat(location.longitude);          // add location array          locations.push({             latitude: lat,             longitude: lng,             title: location.name          });      }       // calls map set state      this.setstate({         annotations: locations            }); } 

and here view code

<view style={styles.container}>     <mapview       style={styles.map}       onregionchangecomplete={this._onregionchangecomplete}       annotations={this.state.annotations}     />   </view> 

you'll want

<mapview   ...   region={region} /> 

where

var region = {   latitude,   longitude,   latitudedelta,   longitudedelta, }; 

latitude , longitude center of map , deltas distance (in degrees) between minimum , maximum lat/long shown. instance, given radius in miles around point , aspect ratio of map view, calculate region follows:

var radiusinrad = radiusinkm / earthradiusinkm; var longitudedelta = rad2deg(radiusinrad / math.cos(deg2rad(latitude))); var latitudedelta = aspectratio * rad2deg(radiusinrad); 

the definitions of rad2deg, deg2rad, , earthradiusinkm left exercise reader.