2017-11-29 6 views
1

反応ネイティブマップを使用して、アンドロイドデバイス上の現在のユーザージオロケーションでマップをレンダリングしようとしています。ここで 反応ネイティブマップを使用して現在の位置を取得する方法

は私がこれまで持っているものです:

import React, { Component } from 'react'; 

import { 
    View, 
    StyleSheet, 
    Dimensions, 
} from 'react-native'; 

import MapView from 'react-native-maps'; 

const {width, height} = Dimensions.get('window') 

const SCREEN_HEIGHT = height 
const SCREEN_WIDTH = width 
const ASPECT_RATIO = width/height 
const LATITUDE_DELTA = 0.0922 
const LONGITUDE_DELTA = LATITUDE_DELTA * ASPECT_RATIO 

class MapComponent extends Component { 
    constructor() { 
    super() 
    this.state = { 
     initialPosition: { 
     latitude: 0, 
     longitude: 0, 
     latitudeDelta: 0, 
     longitudeDelta: 0, 
     }, 
    } 
    } 

    componentDidMount() { 
    navigator.geolocation.getCurrentPosition((position) => { 
     var lat = parseFloat(position.coords.latitude) 
     var long = parseFloat(position.coords.longitude) 

     var initialRegion = { 
     latitude: lat, 
     longitude: long, 
     latitudeDelta: LATITUDE_DELTA, 
     longitudeDelta: LONGITUDE_DELTA, 
     } 

     this.setState({initialPosition: initialRegion}) 
    }, 
    (error) => alert(JSON.stringify(error)), 
    {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}); 
    } 


    renderScreen =() => { 
     return (
     <View style={styles.container}> 
      <MapView 
      style={styles.map} 
      initialRegion={this.state.initialPosition}/> 
     </View> 
    ); 
    } 

    render() { 
    return (
     this.renderScreen() 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    position: 'absolute', 
    top: 0, 
    left: 0, 
    right: 0, 
    bottom: 0, 
    justifyContent: 'flex-end', 
    alignItems: 'center', 
    }, 
    map: { 
    position: 'absolute', 
    top: 0, 
    left: 0, 
    right: 0, 
    bottom: 0, 
    }, 
}); 

export default MapComponent; 

マップのレンダリングではなく、予想通り、現在のデバイスの地理的位置に。

権限がすでにとしてのAndroidManifest.xmlに設定されている(それは海の真ん中にレンダリング):20秒後

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> 

、私は言って警告を取得し、「コード「の場所要求がタイムアウトしました」 3 "

私は間違っていますか?

答えて

2

は、私はよく分からないが、Android上でこの問題に苦しんで他の誰のために

関連見えissue ("Geolocation timed out, code 3")あり、maximumAgeという を削除してみてください:2000のオプションパラメータを。このオプションにより、 ジオロケーションがタイムアウトするか、アプリがクラッシュする可能性がありました。

関連する問題