I will start with the code in question:
<script type="text/javascript">
if(google.loader.ClientLocation){
visitor_city = google.loader.ClientLocation.address.city;
document.getElementById('location').value = visitor_city;
}
</script>
In my case this code fails to produce the correct city at times. It some cases, it posts the correct city once, other times it posts the wrong city, and finally posts nothing at all. I need the city location to be correct in order to control access to my site so I can build a local following. The code was based on the information from this site.
I would like to continue using Google Location services and I am wondering whether anyone else has the same issue. If so, did you come up with a better solution that worked much better?
Edit: I am located in Ottawa, Ontario, Canada, so internet access or geolocation should not be an issue as I am not out in the boonies.
Related
Please forgive me if this is too general for stack overflow, but I'm curious to know how I can go to Yelp, Zillow, or any other sites which are driven by user location.
In my current app, I am using navigator.geolocation so it is front end driven:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition((position) => {
const currentPosition = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
/* set some values, handle error, etc. */
}
However, this can take some time. In my case, after finding the user location I then load the google map on that particular location.
In the case when I go to yelp.com, it doesn't load on my current precise location but rather in my general area. Sometimes it gets my area correct, but other times it is a metro area close to me. In the case of other sites like Zillow, it will load the map on the whole region, like all of San Francisco and surrounding areas, or all of Los Angeles, etc.
How do those sites handle the initial location? Is it something fancy server side, or is it something in the browser, or what?
Thanks
I think they are detecting your IP and then look it up where is the geolocation of the IP supposed to be. Here's an example.
Unstable connection in a normal browser is not a major issue because the user can click on the "reload button" if the page didn't load properly. In phonegap there is no such button, so we have to make sure everythings loads correctly 100% of the time.
I experience a problem because when connection is unstable during the initialisation of a google service (places autocompletion, geocoding or map display), no error message is thrown and yet the service will NOT work.
First we initialize google services
//In this senario the internet connection is good and stable
$('body').append('<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places&v=3.exp&callback=googleCallback"></script>');
Then we want to use the google places autocomplete service and here is a scenario that is reproducible :
//At this point we lose the internet connection
var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'));
//At this point autocomplete is defined and not empty, no error thrown
//At this point the internet connection come back
//At this point the autocomplete box is not working
Note that this "bug" also occurs for geocoding and map display.
The first part of my question is : how can i at least detect in my code that the initialisation of the (autocomplete or geocoding or display map) service didn't work properly.
Now we would like to reload the places autocomplete because internet is back and we need the service
//From now on the connection is good and stable
var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'));
//We get no error but the autocomplete box still does not work
Here is the only way i found to get the places autocomplete service to work after connection loss occured as shown in scenario 1
//From now on the connection is good and stable
$('body').append('<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places&v=3.exp&callback=googleCallback"></script>');
var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'));
//At this point the autocomplete box is working properly
So the second part of my question is, do i really have to reload the hole google maps javascript api when 1 particular service failed to initialize ?
To reproduce the bug you can follow that link, it is referenced as problem 3.
If you're intersted in problem 1 you can check this question
If you're intersted in problem 2 you can check this question
In android I could use google play services and geo location functions to get a user to type a string like "London, England" or "McDonalds" etc.., and have the service take that string and return a set of Location Objects. Each one has a city,address,country,lat,long etc... details.
I'm now making a web app version of it and I want to know if its possible to do this in HTML/html5 with any plugins preferable by trusted companies like Google.
Thanks.
I have to question if you even looked ;)
https://developers.google.com/maps/documentation/javascript/tutorial
The Maps service was born on the web, of course that exists!
When Google returns a NOT_FOUND response to a direction request with waypoints, the documentation says
NOT_FOUND indicates at least one of the locations specified in the requests
origin, destination, or waypoints could not be geocoded.
But it doesn't tell me which one is invalid...
I realise I could then attempt to geocode each address individually to find the bad address, but that is wasting a lot of geocoding requests, given I have about 20 waypoints, and given Google could just tell me which one failed...
Is there a way to do this?
My fallback is to geocode the addresses before I save them, however I'd prefer not to do this, if I can get google to tell me which waypoint failed.
Normally, the response comes back with warnings, and I thought the bad address may come back in that, however I think that only happens if a route can be built in the first place.
Warning items are intended to display information when a route has been found, you are right. For example, it is telling that the walking directions mode results are in beta.
Sample: http://maps.googleapis.com/maps/api/directions/json?origin=Boston,MA&destination=Concord,MA&waypoints=Charle,MA&mode=walking
For the problem you depicted (waypoint is not found), the response of the webservice is really short. Sample call with a non-working waypoint:
http://maps.googleapis.com/maps/api/directions/json?origin=Boston,MA&destination=Concord,MA&waypoints=Chle,MA
Result:
{
"routes" : [],
"status" : "ZERO_RESULTS"
}
The google maps Directions API is not currently helping for your case, and you also cannot try to geocode all your waypoint at once. Furthermore, the geocode api will throw an error if you exceed 5 simultaneous requests, so you initial workaround idea may be limited.
As a workaround (but not perfect, as the results between this service and gmaps service can be different), you could try to use other geocoding services, such as the one provided by OpenStreetMap: http://wiki.openstreetmap.org/wiki/Nominatim#Search
You still have to do it one-by-one, but you won't be getting a "query limit exceeded" error.
I'm using the following to successfully capture user's location (mobile browser):
<script>
if ( navigator.geolocation ) {
navigator.geolocation.getCurrentPosition(handlePosition);
}
function handlePosition(pos) {
//this passes lat/long to additional code
}
</script>
This works, but often times the browser will seemingly cache the location data. The page that calls this geolocation code shows information relative to the user's location, so what happens is the user can move (change location), the page is reloaded, but the previous location data is used (showing incorrect data). Sometimes the page will have to be refreshed once or even twice for the page to use new location data.
Does anyone know of any means to force the code to get and use "up to date" location data each time script is executed?
FWIW, I'm experiencing problem in iOS Safari (6.1). Have not been able to test in Android yet.
Thanks for reading and for any help.
Edit: As Oleksiy has written in his answer, the Geolocation API now supports this. You can add {maximumAge: 0} as the third option parameter of getCurrentPosition. There is also a timeout and a high accuracy option available in the PositionOptions as noted in the specification.
Your navigator call would change to the following:
navigator.geolocation.getCurrentPosition(
handlePosition,
(error)=>{},
{maximumAge:0}
);
No can't be done. You don't have any control over the browser geolocation other than the code in your example. The html5 geo location api is very, very limited and that is a pain. I also had a question whether I could ask it if permission for the domain had already been granted and the answer was also no.
The problem is that the api is implemented in the browser itself and that are just no endpoints for these kind of functions.
What you could do is make an array in js to store previous locations and before you update your view test against that array to see if you got a stale location.
You do have this ability now.
getCurrentPosition takes three parameters: success, failure and options
Try this:
<script>
if ( navigator.geolocation ) {
navigator.geolocation.getCurrentPosition(handlePosition, (error)=>{}, {maximumAge:0});
}
function handlePosition(pos) {
//this passes lat/long to additional code
}
</script>