title: How can I get current location for using Expo location API with React Native?
body: <p>Now I am making the map that we can get the location of kindergartens,but now initialRegion is Tokyo station.
  I would like to adjust the map as getting  current location when user open the app,or something button is
  pressed.How can I add the code??</p>
  <p>below is current code,and it can get the location of kindergartens when the button is pressed.</p>
  <pre><code>import React from 'react';
  import { StyleSheet, Text, View,TouchableOpacity } from 'react-native';
  import MapView from 'react-native-maps';
  import {point} from '@turf/helpers';
  import destination from '@turf/destination';
  
  export default class App extends React.Component {
      constructor(props) {
          super(props) 
          this.state = {
              elements: [],
              south:null,
              west:null,
              north:null,
              east:null,
  
          }
      }
  
          //地図の画面が変更されるたびにbboxを計算
          onRegionChangeComplete = (region) =&gt; {
          //111キロメートルから中心点から縦幅、横幅を計算
          const center = point([region.longitude, region.latitude])
          const verticalMeter = 111 * region.latitudeDelta / 2
          const horizontalMeter = 111 *region.longitudeDelta / 2
          //実際の距離を計算
          const options = {units: 'kilometers'}
          const south = destination(center,verticalMeter,180,options)
          const west = destination(center,horizontalMeter,-90,options)
          const north = destination(center,verticalMeter,0,options)
          const east = destination(center,horizontalMeter,90,options)
          //計算結果（GeoJson）からbboxを保存する
          this.setState({
              south:south.geometry.coordinates[1],
              west:west.geometry.coordinates[0],
              north:north.geometry.coordinates[1],
              east:east.geometry.coordinates[0],
          })
      }
  
          fetchToilet = async  () =&gt; {
              const south = this.state.south
              const west = this.state.west
              const north = this.state.north
              const east = this.state.east
              //テンプレートリテラルを使ってbboxを展開
              const body = `
              [out:json];
              (
                  node
                  [amenity=kindergarten]
                  (${south},${west},${north},${east});
  
              );
              out;
              `
  
              //fetch関数に渡すoptionを指定
              const options = {
                  method: 'POST',
                  body: body
              }
  
              //fetch関数でOverpass APIのエントリポイントにアクセスし、取得したJSONを保存
              try {
                  const response = await fetch('https://overpass-api.de/api/interpreter',options)
                  const json = await response.json()
                  this.setState({elements: json.elements})
              }catch (e) {
              console.log(e)
          
              }
  }
      render() {
          return (
              &lt;View style ={styles.container}&gt;
              &lt;MapView
              onRegionChangeComplete={this.onRegionChangeComplete}
                  style={styles.mapView}
                  initialRegion={{
                      latitude: 35.681236,
                      longitude: 139.767125,
                      latitudeDelta: 0.02, //小さくなるほどズーム
                      longitudeDelta: 0.02,
                  }}&gt;
  
                  {
                      this.state.elements.map((element) =&gt;{
  
                          let title= &quot;保育園&quot;
                          if (element.tags[&quot;name&quot;] !==undefined) {
                              title = element.tags[&quot;name&quot;]
                          }
                          return (&lt;MapView.Marker
                              coordinate={{
                                  latitude: element.lat,
                                  longitude: element.lon,
                              }}
                              title={title}
                              key={&quot;id_&quot; + element.id}
                          /&gt;)
                      })
  
                  }
  
                      &lt;/MapView&gt;
  
  
              &lt;View style ={styles.buttonContainer}&gt;
              &lt;TouchableOpacity
              onPress={() =&gt; this.fetchToilet()}
              style={styles.button}
              &gt;
              &lt;Text style={styles.buttonItem}&gt;保育園取得&lt;/Text&gt;
              &lt;/TouchableOpacity&gt;
              &lt;/View&gt;
              &lt;/View&gt;
      
          );
      }
  }
  
  const styles = StyleSheet.create({
  
      container: {
        flex: 1,
        backgroundColor:'#fff',
        alignItems: 'center',
        justifyContent: 'flex-end',
        
      },
    
      mapView: {
        ...StyleSheet.absoluteFillObject,
      },
    
      
  
      buttonContainer: {
         flexDirection:'row',
         marginVertical:20,
         backgroundColor:'transparent',
         alignItems:'center',
      },
    
      button: {
          width:150,
          alignItems:'center',
          justifyContent:'center',
          backgroundColor:'rgba(255,235,255,0.7)',
          paddingHorizontal:18,
          paddingVertical:12,
          borderRadius:20,
      },
  
      buttonItem: {
          textAlign:'center',
      },
  
  
    });
  </code></pre>