react-native-mapでズームイン/ズームアウトする方法は？

Question

私はreact-nativeを使ってマップアプリケーションを構築しています。私が使用しているAPIは、https://github.com/lelandrichardson/react-native-mapsからのリンクです。以下は私のアプリにマップを持っているコードです。私はその地図上でどのようにズーム値を与えることができますか？そして、ユーザーが地図上のボタンをクリックするとズーム値をどのように変更できるのですか？これを達成するために使用すべきズームAPIは何ですか？

import React, { 


AppRegistry, 
    Component, 
    StyleSheet, 
    Text, 
    View, 
    Image, 
    ListView, 
    TextInput, 
    TouchableHighlight, 
    Dimensions, 
//MapView, 
} from 'react-native'; 

import MapView from 'react-native-maps'; 

const styles = StyleSheet.create({ 
    map: { 
    position: 'absolute', 
    top: 0, 
    left: 0, 
    right: 0, 
    bottom: 0, 
    }, 
    container: { 
    flexDirection: 'row', 
    justifyContent: 'space-between', 
    padding: 30, 
    flex: 1, 
    alignItems: 'center' 
    }, 
    inputText: { 
    height: 36, 
     padding: 4, 
     marginRight: 5, 
     flex: 4, 
     fontSize: 18, 
     borderWidth: 1, 
     borderColor: '#48BBEC', 
     borderRadius: 8, 
     color: '#48BBEC' 
    } 
}); 

class MapPage extends Component{ 

    constructor(props){ 
     super(props); 
     this.state = { 
      region:{ 
       latitude: 4.21048, 
       longitude: 101.97577, 
      latitudeDelta: 10, 
      longitudeDelta: 5 
      } 
     } 
    } 

    render() { 
     return(
      <View style={styles.container}> 
       <TextInput style={styles.inputText}></TextInput> 
       <MapView 
        style={ styles.map } 
        mapType={"standard"} 
        region={this.state.region} 
        zoomEnabled={true} 
        scrollEnabled={true} 
        showsScale={true} 
        ></MapView> 
      </View> 
      ) 
    } 
} 

module.exports = MapPage; 

Answer 1

あなたはそれはlatitudeDeltaとlongitudeDeltaを持つ領域オブジェクトを受け取り

（hereを参照）animateToRegionメソッドを使用する必要があります。これらを使用してズームレベルを設定します。

更新：Regionオブジェクトlatitudeとlongitudeで

中心位置とlatitudeDeltaを指定しlongitudeDeltaは視認マップ領域のスパンを指定します。

この画像はthisから投稿されました。ブログ投稿はそれをよく示しています（LatΔとLngΔ）。

Answer 2

私はDimensions.get('window');

を使用して、この作品を作ることができたと、デフォルトでLATITUD_DELTA = 0.0922を設定します。 次に、<MapView>