Question

so I’ve run into a problem recently, and maybe you guys can help.

So to start off, I’ve created website and a marker, and I’m trying to retrieve the center point to reverse-geocode the address.

My code is below :

function ReverseGeocode(lat, lng)
{
    var latlng = new google.maps.LatLng(lat, lng);
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({"latLng": latlng}, function(results, status)
    {
        if (status != google.maps.GeocoderStatus.OK)
        {
            alert("Geocoding has failed due to "+ status);
        }
        address = results[0].formatted_address;
    });
}

The problem I’m having here, is when I try to pass “address” back out (address is right now a global variable) all I get is “undefined”.

Here’s the code where I’m trying to pass it back out:
sendString += ‘&lat=’ + lat;
sendString += ‘&lng=’ + lon;
ReverseGeocode(center.lat(), center.lng());
alert(“”+address);

sendString += '&address=' + address 
var currentLang = "en"
sendString += '&phone=' + document.getElementById("number").value;
sendString += '&email=' + document.getElementById("email").value;
sendString += ($("prefsms").checked)?'&contactMethod=sms':'&contactMethod=email';
sendString += '&serviceType=' + document.getElementById("serviceType").value;
sendString += '&language=' + currentLang;
alert(""+sendString);

In my alert box, all I get is “undefined”. Yet, if I add another alert box INTO the ReverseGeocode function, I’ll get the address in an alert box, but this occurs AFTER the alert box in the outside function.

Any ideas as to what’s going on? I would have thought that the alert box inside the ReverseGeocode function would go first, not the other way around.

Thanks!

Answer 1

As Heitor Chang said, Geocoding is asynchronous – so when you try to return the address, it get’s returned to the function you pass as a callback to geocoder.geocode(). Confused? see this:

function ReverseGeocode(lat, lng)
{
    var latlng = new google.maps.LatLng(lat, lng);
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({"latLng": latlng}, function(results, status)
    {
        if (status != google.maps.GeocoderStatus.OK)
        {
            alert("Geocoding has failed due to "+ status);
        }
        return results[0].formatted_address; // this is how you might've been returning (i am just assuming since you didn't provide any code that returns address.
    });
}

Now you can see that it gets returned to the function you are passing to geocoder.geocode()

What you should be doing is use callbacks – you are passing one here, probably without realising it – accept a callback as the third argument to ReverseGeocode function and when you get the result as OK, call the callback and return the address. Here’s how:

function ReverseGeocode(lat, lng, cb)  // cb - callback, a function that takes the address as an argument.
{
    var latlng = new google.maps.LatLng(lat, lng);
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({"latLng": latlng}, function(results, status)
    {
        if (status != google.maps.GeocoderStatus.OK)
        {
            alert("Geocoding has failed due to "+ status);
        }
        cb(results[0].formatted_address); // call the callback passing to it the address and we're done.
    });
}

How to use it? This way:

ReverseGeocode( LAT, LNG, function(address) {
    // do something with the address here. This will be called as soon as google returns the address.
});