反应本地获取当前位置

时间:2019-12-25 17:25:25

标签: android react-native react-native-maps currentlocation

我尝试使用react-native-maps并获取我的当前位置。 我不仅尝试使用“ react-native-geolocation-service”和“ @ react-native-community / geolocation”。 地图仍显示Google HQ可能在旧金山。 ({{“坐标”:{“精度”:20,“海拔”:5,“航向”:0,“纬度”:37.4219983,“经度”:-122.084,“速度”:0},“模拟”:false ,“时间戳记”:1577294172000})

如何在我的Android模拟器(Pixel_2和Pixel_3)中加载当前位置。 请回答我... 我已经努力了一个多星期……

下面是我的包裹。

  "dependencies": {
    "@react-native-community/geolocation": "^2.0.2",
    "react": "16.9.0",
    "react-native": "0.61.5",
    "react-native-android-location-enabler": "^1.2.0",
    "react-native-geolocation-service": "^3.1.0",
    "react-native-maps": "0.26.1"
  },



import React, {Component} from 'react';
import {StyleSheet, Text, View, Button, Alert, TextInput,
  TouchableWithoutFeedback, 
  TouchableHighlight, TouchableOpacity,
  Keyboard, ScrollView, PermissionsAndroid,
} from 'react-native';

import MapView, {Marker}  from 'react-native-maps';
import Geolocation from 'react-native-geolocation-service';
// import Geolocation from '@react-native-community/geolocation';
import RNAndroidLocationEnabler from 'react-native-android-location-enabler';

Geolocation.getCurrentPosition(
  (position) => {
      console.log(position);
  },
  (error) => {
      // See error code charts below.
      console.log(error.code, error.message);
  },
  { enableHighAccuracy: true, timeout: 15000, maximumAge: 10000 }
);


export default class App extends Component {


  render() {
    return (

        <View style={styles.container}>


        <MapView

          minZoomLevel={6}
          maxZoomLevel={16}
          // mapType="none"
          style={styles.map}
          initialRegion={{

            // latitude: this.state.location.coords.latitude,
            // longitude: this.state.location.coords.longitude,
            latitude: 37.4219983,
            longitude: -122.4324,
            latitudeDelta: 0.0922,
            longitudeDelta: 0.0421,
          }}>


               <Marker
          coordinate={{latitude: 37.78825, longitude: -122.4324}}
          title="this is a marker"
          description="this is a marker example"
        />


        </MapView>
        <Text style={styles.SampleHeader}>
             GUDUGUDU ^^  
             </Text>
      </View>

    );
  }
}

const styles = StyleSheet.create({
  SampleHeader: {
    // flex: 3,
    // flexDirection: 'column',
    backgroundColor: '#d9d9d9',
    // width: 90,
    paddingTop: 0,
    paddingBottom: 5,
    marginLeft: 15,
    marginRight: 15,
    marginTop: 5,
    marginBottom: 5,
    textAlign: "center",
    // fontFamily: 'Cochin',
    fontSize: 22,
    fontWeight: '300',
    color: 'black',
    padding: 5,
    borderRadius: 10,
  },
  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,
  },


});
'''

3 个答案:

答案 0 :(得分:0)

这对于Android模拟器来说是完全正常的。他们默认使用Google总部位置,您必须在设置中手动输入其他位置。

首先,您必须单击模拟器旁边的侧面菜单底部的三个点:

然后转到位置标签:

您现在可以将LatitudeLongitude更改为所需的值,然后按SEND来更新模拟器的位置。

答案 1 :(得分:0)

我所在位置的模拟器用户界面与您的不一样。如何调用该函数?

My emulator: Pixel_2

答案 2 :(得分:0)

您应该首先通过搜索框找到您的初始位置。 找到它后,请在地图上单击以指定您的确切位置。 然后按“设置位置”按钮