React-native Geolocation
I'm new to react. And I'm expecting to build a mobile Application from Web-App using Cordova plug-in. So in this case I want to get the App location. I'm trying this with react-native Geolocation.
I followed the tutorial from facebook at here. But when I tried it, It does not show me the position. Instead value of the position change from unknown to {}.
There might be few errors I'm doing here.
- I'm using a proxy
- Testing this in browser not in Android or any other native device.
- Facebook Link says it is react-native but my project was created by create-react-app which I think not React-native
If any of these is not the cause for this error, Please help.
My code,
import React,{Component} from 'react';
class GeoLocation extends React.Component {
state = { initialPosition: 'unknown',
lastPosition: 'unknown', };
watchID: ?number = null;
componentDidMount() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition( (position) => {
var initialPosition = JSON.stringify(position);
this.setState({initialPosition});
},
(error) => alert(JSON.stringify(error)), {
enableHighAccuracy: true, timeout: 20000, maximumAge: 1000
} );
this.watchID = navigator.geolocation.watchPosition((position) => {
var lastPosition = JSON.stringify(position);
this.setState({lastPosition});
});
}
}
componentWillUnmount() {
navigator.geolocation.clearWatch(this.watchID);
}
render() {
return (
<div className="main">
<h1> Initial position: {this.state.initialPosition} </h1>
<h1> Current position: {this.state.lastPosition} </h1>
</div>
);
}
}
export default GeoLocation;
At HyperTrack we have built a location service and included some React libraries and sample apps for React and Cordova found on our Github. Likely this would solve the issues you are having with grabbing location, or at least get you on the right track.
Comments
Post a Comment