Very nice explanation! And I like it that you used the geolocation API for an example. May I ask 2 things, please:
Wouldn't it be better to put the "geolocation in navigator" check outside of the actual getGeolocation method? Now this check is called every time when I click on the screen, which seems superfluous, since I already checked it. To me it seems to make more sense to offer the button (or the document.addeventListener) only, when geolocation is available. That way the check would only happen once – and consequently make the UI cleaner, since there wouldn't be a button for calling the geolocation.
Is there any chance you could make a tutorial on how to use the "maximumAge" parameter of the geolocation's options object? I tried to make sense of it, but... my brains stays dark...
I thought the idea of the maximumAge param is to set a time value (like 10 secs), that caches a position value, so all the next values that the device recognizes, have no efect, because within the 10 seconds the cached values are taken. That way I have a way to save less position coords in a tracking app, e.g. (Because if I save any and all coordinate, the data would explose in size really quick!)
However, it seems it does not work at all like that. Whenever I save a value (reduced to 6 post-comma positions) to an oldVal var and compare it with the new incoming val, I get new data all the time. Never a cached one.
Would be awesome if you could shed light on that feature!
Thanks!
Thanks for the comments and questions. :)
I have a video tutorial on my YouTube channel all about Geolocation - youtube.com/watch?v=NIAqR34eg7I . There are other geolocation tutorials with Google maps, Cordova, and React Native too, but this is the first one focused on just geolocation.
Any time you are going to use any API you want to put the check for the feature as close as possible to the actual use as you can. You never know where your function module may end up. So, you should keep the code all bundled together so it can be moved together.
If you want to avoid the check, which really is only taking a fraction of a millisecond to check for the existence of a property inside an object, then you could create a variable outside the function, still inside the module, to save the result. But then you need to check the value of that variable. Either check would take the same amount of time but the second way requires using extra memory to save the value.
Thank you for your answer! I need to explain my situation a bit more. First of all, I am talking about the "watchGeolocation" option, not the "getCurrentPosition" option that you use in your other tutorials. (BTW: I know that there are many tutorials out there, but it seems none talks about the proper usage of "maximumAge".)
In my understanding, when I set maximumAge to e.g. 5000, then all incoming GPS signals within the next 5 seconds should have the same timestamp, since they would be fetched from the cache. Right? But this is not the case.
This example shows clearly that the timestamp changes whenever a GPS signal is recognised (about every second).
So I wonder: What the heck is this maximumAge value doing really?
The idea is to build a tracking app. The user should set a maximumAge (a higher one, when the activity is walking, a lower one, when the activity is biking etc.. the usual stuff...), so the app does not save each and every incoming GPS value. I would set the first new value to a var called "cachedTimestamp" and compare all the next incoming values with that cached timestamp. That would enable me to save a new value only every 30 seconds (e.g.).
But since the timestamp changes all the time, this is not the way to go.
maximumAge doesn't keep the same timestamp with each request.
The browser will cache a coordinates object with a timestamp.
Each subsequent time you make a request, it will look at the current timestamp and compare it with the cache result's timestamp. If you have not reached the maximumAge yet then you get a copy of the coordinates object along with a current timestamp.
The position object
{
timestamp: current value for the current request
coords: { this could be the cached coords object or a new one if you are past the cached timestamp }
}
HOWEVER...
The browser is allowed to adjust the result in the interest of better battery life and lowered use of the radio antenna in the device.
It also uses the highAccuracy setting to decide what to do based on other things happening on the device. When you say that you want highAccuracy, you are really just saying that it is allowed for the device to use it, not that the device MUST use it.
The developer provides their best intention to the browser through the options object, but it is still up to the browser to interpret those settings.
Many of the HTML5 APIs work this way.
What I observe is that the coordinate values change all the time, no matter what. So if I understand you correctly: Using maximumAge to manage the amount of geolocation points to be saved to a data store is unreliable. If I want to save a geolocation datum only every 3rd second; i need to implement my own timer.
To be honest: I do not really understand, what this setting is good for, if the browser does whatever it wants whenever it wants... :-(
However, I love your tutorials and texts and am looking forward to new stuff of yours! Thank you again! Have a good day!
You're very welcome.
Just bear in mind that changing the maximumAge option, the enableHighAccuracy option, or using a timer you create yourself will get similar results. The management of the radio in the phone is beyond absolute control of the JS. It will always be the device and the browser that get to make the final decision about how to use the radio - wifi, gps, etc.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Very nice explanation! And I like it that you used the geolocation API for an example. May I ask 2 things, please:
Wouldn't it be better to put the "geolocation in navigator" check outside of the actual getGeolocation method? Now this check is called every time when I click on the screen, which seems superfluous, since I already checked it. To me it seems to make more sense to offer the button (or the document.addeventListener) only, when geolocation is available. That way the check would only happen once – and consequently make the UI cleaner, since there wouldn't be a button for calling the geolocation.
Is there any chance you could make a tutorial on how to use the "maximumAge" parameter of the geolocation's options object? I tried to make sense of it, but... my brains stays dark...
I thought the idea of the maximumAge param is to set a time value (like 10 secs), that caches a position value, so all the next values that the device recognizes, have no efect, because within the 10 seconds the cached values are taken. That way I have a way to save less position coords in a tracking app, e.g. (Because if I save any and all coordinate, the data would explose in size really quick!)
However, it seems it does not work at all like that. Whenever I save a value (reduced to 6 post-comma positions) to an oldVal var and compare it with the new incoming val, I get new data all the time. Never a cached one.
Would be awesome if you could shed light on that feature!
Thanks!
Thanks for the comments and questions. :)
I have a video tutorial on my YouTube channel all about Geolocation - youtube.com/watch?v=NIAqR34eg7I . There are other geolocation tutorials with Google maps, Cordova, and React Native too, but this is the first one focused on just geolocation.
Any time you are going to use any API you want to put the check for the feature as close as possible to the actual use as you can. You never know where your function module may end up. So, you should keep the code all bundled together so it can be moved together.
If you want to avoid the check, which really is only taking a fraction of a millisecond to check for the existence of a property inside an object, then you could create a variable outside the function, still inside the module, to save the result. But then you need to check the value of that variable. Either check would take the same amount of time but the second way requires using extra memory to save the value.
Thank you for your answer! I need to explain my situation a bit more. First of all, I am talking about the "watchGeolocation" option, not the "getCurrentPosition" option that you use in your other tutorials. (BTW: I know that there are many tutorials out there, but it seems none talks about the proper usage of "maximumAge".)
In my understanding, when I set maximumAge to e.g. 5000, then all incoming GPS signals within the next 5 seconds should have the same timestamp, since they would be fetched from the cache. Right? But this is not the case.
I setup an example here:
geolocation-maximumage-test.vercel...
The repo is here:
bitbucket.org/rowild/geolocation-m...
(Sorry for the meaningless git messages...)
This example shows clearly that the timestamp changes whenever a GPS signal is recognised (about every second).
So I wonder: What the heck is this maximumAge value doing really?
The idea is to build a tracking app. The user should set a maximumAge (a higher one, when the activity is walking, a lower one, when the activity is biking etc.. the usual stuff...), so the app does not save each and every incoming GPS value. I would set the first new value to a var called "cachedTimestamp" and compare all the next incoming values with that cached timestamp. That would enable me to save a new value only every 30 seconds (e.g.).
But since the timestamp changes all the time, this is not the way to go.
Any idea what is going n here?
Thank you very much!
maximumAge doesn't keep the same timestamp with each request.
The browser will cache a coordinates object with a timestamp.
Each subsequent time you make a request, it will look at the current timestamp and compare it with the cache result's timestamp. If you have not reached the maximumAge yet then you get a copy of the coordinates object along with a current timestamp.
The position object
{
timestamp: current value for the current request
coords: { this could be the cached coords object or a new one if you are past the cached timestamp }
}
HOWEVER...
The browser is allowed to adjust the result in the interest of better battery life and lowered use of the radio antenna in the device.
It also uses the highAccuracy setting to decide what to do based on other things happening on the device. When you say that you want highAccuracy, you are really just saying that it is allowed for the device to use it, not that the device MUST use it.
The developer provides their best intention to the browser through the options object, but it is still up to the browser to interpret those settings.
Many of the HTML5 APIs work this way.
Thank you again very much, Steve!
What I observe is that the coordinate values change all the time, no matter what. So if I understand you correctly: Using maximumAge to manage the amount of geolocation points to be saved to a data store is unreliable. If I want to save a geolocation datum only every 3rd second; i need to implement my own timer.
To be honest: I do not really understand, what this setting is good for, if the browser does whatever it wants whenever it wants... :-(
However, I love your tutorials and texts and am looking forward to new stuff of yours! Thank you again! Have a good day!
You're very welcome.
Just bear in mind that changing the maximumAge option, the enableHighAccuracy option, or using a timer you create yourself will get similar results. The management of the radio in the phone is beyond absolute control of the JS. It will always be the device and the browser that get to make the final decision about how to use the radio - wifi, gps, etc.