Is it possible to directly access smartphone GPS data from javascript in order to get the exact position of user?
By using navigator.geolocation.getCurrentPosition( , , options)
along with
const options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
we get quite accurate coordinates,
but checking at the same time Google Maps we can see that pointers do not center at the same location, coordinates are slighty different
Related
I am trying to add to my leaflet map a layer with current weather. For that I am using this leaflet plugin https://github.com/buche/leaflet-openweathermap that is using this call:
https://tile.openweathermap.org/map/{layer}/{z}/{x}/{y}.png?appid={API key}
The free version of OWM is offering 60 calls per minute, the problem is that every time that I zoom or drag the map 12 petitions to the API are being requested. I thought the free version with the 60c/m should be more than enough for my app, but as soon I zoom few times the API key gets blocked. Is there a better way to work around this?
The more tiles your map requests, the sooner you reach the limit. In order to reduce the amount of tiles requested (with a cost to user experience), consider limiting zoom/drag options.
// change options according to your needs
let mapOptions = {
zoomControl: false,
scrollWheelZoom: false,
boxZoom: false,
dragging: false
}
let map = L.map('map', mapOptions);
I am using Geolocation on Android to get a user's position. I am a little bit confused about the EnableHighAccuracy setting. Basically, to make this work I have to set it to "true" for Android Simulator and to "false" for a physical device. Otherwise its broken and I get timeout error and no location.
Can someone please clarify why this might be the case? It seems strange that this one setting completely breaks it when it should not. I don't know if this has perhaps something to do with device settings or something else. Seems a bit dangerous for production with this being so hacky. Thanks.
navigator.geolocation.getCurrentPosition(
async (locationObj) => {
//Some code
},
(error => Alert.alert("Could not get location"),
{ enableHighAccuracy: true, timeout: 15000 }
)
if you set "enableHighAccuracy" to true then it will use GPS and location will be accurate .
This is a bug in Geolocation . On Android it will timeout . if you want accurate location and want to enableHighAccuracy then you should use react-native-geolocation-service
As described in library
"This library is created in an attempt to fix the location timeout issue on android with the react-native's current implementation of Geolocation API."
Also recommended in official site of React Native
"On Android, this uses the android.location API. This API is not recommended by Google because it is less accurate and slower than the recommended Google Location Services API. In order to use it with React Native, use the react-native-geolocation-service module."
Try this
...
import Geolocation from 'react-native-geolocation-service';
...
componentDidMount() {
// Instead of navigator.geolocation, just use Geolocation.
if (hasLocationPermission) {
Geolocation.getCurrentPosition(
(position) => {
console.log(position);
},
(error) => {
// See error code charts below.
console.log(error.code, error.message);
},
{ enableHighAccuracy: true, timeout: 15000, maximumAge: 10000 }
);
}
}
On the iPhone with the location service activated on Safari or Chrome, the location is not accurate (like 1-2 miles difference). It seems that it apparently doesn't use the GPS coords. How can I make it as accurate as possible on the iPhone?
const options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
navigator.geolocation.getCurrentPosition(
success,
error,
options
);
success = (pos) => {
console.log(pos);
}
Why isn't it using the exact GPS Coordinates on the iPhone with activated Location Service on Safari / Chrome?
I have the following code in my app:
var geo = { lat: 0, lon: 0 };
navigator.geolocation.getCurrentPosition(
function( position ) {
// set global vars
geo.lat = position.coords.latitude;
geo.lon = position.coords.longitude;
},
function( error ) {
// handle error
geolocationError( error );
},
{ maximumAge: 3000, timeout: 5000, enableHighAccuracy: true }
);
For one reason or another the location that I get in my app using the above code is very different (100's of meters, sometimes a 1KM or more) than what is displayed in the native map application (i.e. iOS Maps). Why is this?
It's particularly a problem in places where there is no Wifi and I am indoors. For example, recently in an airport my position in the native map application was very accurate; I was positioned in the right terminal - but when I opened my app and refreshed it many times over several minutes the position wasn't anywhere near the terminal I was in, in fact I was about 1KM from the airport.
What do I need to do to get at the very least, the geolocation that the native apps are able to get?
I ran into this issue multiple times before - there isn't anything you can really do about it even if you set enableHighAccuracy to true. It's an issue with the HTML5 geolocation method. Turning on wifi and bluetooth increases the accuracy, but you can't guarantee a user will do that every time.
Best of luck.
I am creating a browser app where, one of the pieces of functionality, is that the user is placed on a map, and then the surrounding area is searched for nearby "things." It is important (and a requirement) that I am as accurate as possible since the nearby location makes a big difference to what is shown to the user.
In order to place the person on the map, I wrote the below code (there is a bit more, but I'm leaving that part out). But, in every case, I am seeing the accuracy range from right on top of my location, to up to a few hundred meters away. There doesn't seem to be any rhyme or reason as to why.
I am outside when I am measuring. I am disconnected from any WiFi (but my WiFi is enabled). I am testing iOS devices on Safari and Chrome, and I am testing Android devices on Chrome. The results are similar across all devices.
One thing I have noticed is that I see that the phones are making requests for location. I see the GPS symbol show up (briefly) on my Android devices. I can see that Safari and Chrome have made recent location requests in the Apple Location Settings. In addition, when I navigate the user to the location (which breaks out into apps like Google Maps or Apple Maps), the location is very accurate and found immediately.
Am I doing something wrong here? Is there something I can do to increase accuracy?
// Attempt to get low-accuracy location if high cannot be retrieved.
function handleLocationError_high(error) {
if(error.code == error.TIMEOUT) {
// Attempt low accuracy if a timeout occurs.
navigator.geolocation.getCurrentPosition(
locationSuccessCallback,
handleLocationError_low,
{timeout: 10000, maximumAge: 0, enableHighAccuracy: false});
} else {
handleLocationError_low(error);
}
}
// Handle the error if location cannot be retrieved at all.
function handleLocationError_low(error) {
console.log('No location found!');
}
// Geolocation callback if there is success in getting the golocation (high or low accuracy).
function locationSuccessCallback(position) {
var pos = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
// ...place the user on the map.
}
// Try HTML5 geolocation.
// Test for support of geolocation. If it is not supported, error.
// Next, attempt to get high accuracy (GPS) position. If that times out, get the low accuracy position.
if(!navigator.geolocation) {
handleLocationError_low();
return;
}
navigator.geolocation.getCurrentPosition(
locationSuccessCallback,
handleLocationError_high,
{timeout: 5000, maximumAge: 0, enableHighAccuracy: true});