New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot read property 'geocodePosition' of undefined #62

Open
Mate38 opened this Issue Oct 24, 2017 · 5 comments

Comments

Projects
None yet
5 participants
@Mate38

Mate38 commented Oct 24, 2017

This is my code:

import React, { Component } from 'react';
import { 
  AppRegistry, 
  View, 
  Text
} from 'react-native';
import Geocoder from 'react-native-geocoder'; // 0.5.0

Geocoder.apiKey = '__API__KEY__';

export default class teste47 extends Component {
  constructor(props) {
    super(props);

    this.state = {
      latitude: null,
      longitude: null,
      place: 'Localizando endereço...',
      error: null,
    };
  }

  componentDidMount() {
   navigator.geolocation.getCurrentPosition(
    position => {
      this.setState(
        {
          latitude: position.coords.latitude,
          longitude: position.coords.longitude,
          error: null,
        },
        () => {
          Geocoder.geocodePosition({
            lat: this.state.latitude,
            lng: this.state.longitude,
          }).then(res => {
            this.setState({
              place: res[0].formattedAddress,
            });
          });
        }
      );
    },
    error => this.setState({ error: error.message }),
    { enableHighAccuracy: true, timeout: 20000 }
  );
 }

  render() {
    return (
      <View style={{ flexGrow: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Latitude: {this.state.latitude}</Text>
        <Text>Longitude: {this.state.longitude}</Text>
        <Text>{this.state.place.toString()}</Text>
        {this.state.error ? <Text>Error: {this.state.error}</Text> : null}
      </View>
    );
  }
}

AppRegistry.registerComponent('teste47', () => teste47);

I created the project with react-native init I added the <uses-permission android: name = "android.permission.ACCESS_FINE_LOCATION" /> to AndroidManifest.xml and I used the react-native link to link.

But when I run the project this returns latitude and longitude to then display an error screen:

screenshot_1508871624

I really have not found the error, what can it be?

@Deniscapp

This comment has been minimized.

Deniscapp commented Nov 1, 2017

Having the same problem here!

@Mate38

This comment has been minimized.

Mate38 commented Nov 1, 2017

I ended up giving up using the library, through the help I received in stackoverflow, I solved my problem by performing the requisition for google api:

componentWillMount() {
  navigator.geolocation.getCurrentPosition(
  (position) => {
    this.setState({
      latitude: position.coords.latitude,
      longitude: position.coords.longitude,
      error: null,
    }, () => this.getGeocode()); // call the api after getCurrentPosition is finished
  },
   (error) => this.setState({ error: error.message }),
   { enableHighAccuracy: true, timeout: 20000 },
 );

}
getGeocode() {
 axios.get('https://maps.googleapis.com/maps/api/geocode/json?address='+ this.state.latitude +','+ this.state.longitude +'&key=__API_KEY__') // be sure your api key is correct and has access to the geocode api
.then(response => {
  console.log(response);
    this.setState({
        place: response.data.results[0].formatted_address // access from response.data.results[0].formatted_address
    })
 }).catch((error) => { // catch is called after then
   this.setState({ error: error.message })
 });
}

But I still want to find out why I can not do it with the library.

@saiful619945

This comment has been minimized.

saiful619945 commented Nov 2, 2017

Facing same problem

@Vnicius

This comment has been minimized.

Vnicius commented Jan 27, 2018

Run react-native link react-native-geocoder and rebuild work for me

@ankitsinghania94

This comment has been minimized.

ankitsinghania94 commented Feb 2, 2018

Better to link manually

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment