navigator.geolocation.getCurrentPosition не работает в React Native

Question

   constructor(props) {
        super(props);
        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) => this.setState({ error: error.message }),
            { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 },
          );

Моя getCurrentPosition функция не работает

После того, как я узнаю свое текущее местоположение, как я могу получить название моего текущего местоположения.

Как это исправить?

Answer 1

Это то, как вы получаете адрес и все, что вы хотите от API карты Google.

handleAddress = () => {
        const API_KEY = 'xxxxxxxxxxxxxxxxxxxxxxxxxxx';
        const {latitude, longitude} = this.props;
        const requestOption = {
            method: 'GET'
        };

        fetch(`https://maps.googleapis.com/maps/api/geocode/json?address=${latitude},${longitude}&key=${API_KEY}`, requestOption)
            .then(res => res.json())
            .then(response => {
                this.setState({
                    address: response.results[0].formatted_address});
            })
            .catch(error => {
                console.warn(error);
            });
    };

Answer 2

Местоположение

Я думаю, вам нужно прочитать документацию о том, как расположение работает в реагирующем. Есть все методы, которые вам нужны для отслеживания местоположения пользователей.

https://facebook.github.io/react-native/docs/geolocation

getCurrentPosition

Вызывает успешный обратный вызов один раз с последней информацией о местоположении.

Это означает, что вы получаете только одно обновление для каждого вызова этой функции. Так что, если вы ожидаете, что он получит непрерывный поток обновлений, вы не читаете документацию.

watchPosition

Вызывает успешный обратный вызов при каждом изменении местоположения.

Это означает, что всякий раз, когда ваше устройство перемещает местоположение, вы будете получать уведомления и можете обновить свое состояние, указав новое местоположение. Тем не менее, он обновляется только при перемещении местоположения. Если вы не перемещаете местоположение, вы не будете получать обновления.

Из этого туториала вы узнаете, как использовать различные методы, доступные для определения местоположения. https://hackernoon.com/react-native-basics-geolocation-adf3c0d10112

Обратный поиск геокодов

Во-вторых, получение имени текущего местоположения пользователя на основе координат GPS называется обратным поиском геокода. В настоящее время существует несколько пакетов, которые делают это

https://www.npmjs.com/package/@kiwicom/react-native-reverse-geocode

https://www.npmjs.com/package/@binpar/react-native-geocoder

https://www.npmjs.com/package/react-native-geocoder

Некоторые из них находятся в альфа / бета-версии, некоторые не обновлялись годами. Таким образом, ваш пробег может отличаться, однако вы не можете использовать эти пакеты с Expo.

Обратное геокодирование с помощью fetch и google api

Вы должны посмотреть документацию, которая есть у Google. https://developers.google.com/maps/documentation/geocoding/start#reverse

Напоминание. Чтобы использовать API геокодирования, необходимо получить ключ API и должен включить биллинг. Вы можете включить биллинг, когда получите ключ API (см. Краткое руководство) или как отдельный процесс (см. Использование и Billing).

Эта простая функция должна позволить вам выполнить обратный поиск в геокоде, вам просто нужно передать широту, долготу и ключ Google API

async getAddress (latitude, longitude, APIKEY) {
  let url = `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${APIKEY}`;
  try {
    let response = await fetch(url);
    let responseJson = await response.json();
    // do what you want with the responseJson here.
    return responseJson
  } catch (error) {
    console.warn(error); 
    // make sure you handle error and return something if an error occurs
  }
}