Very Strange Javascript Scoping Issue

The following variable my_cords is undefined when it gets to the google maps function, can anyone understand why and possible give me a work around? I have defined it right at the

Solution 1:

geocoder.geocode is an asynchronous function. The anonymous function that sets my_cords won't run until some event (probably the arrival of an HTTP response) fires.

Move the code that depends on it running to inside that function.

Solution 2:

.geocode is an asynchronous call.

Try using callbacks in the function.

For example:

geocoder.geocode( { 'address': address}, function(results, status) {

    if (status == google.maps.GeocoderStatus.OK) {

        createMap(results[0].geometry.location);

    } else {

        alert("Sorry we couldn't locate the carehome on the map: " + status);
        returnfalse;

    }

});

var createMap = function(my_cords)  {
     var myOptions = {
        zoom: 7,
        center: my_cords,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

Solution 3:

Because geocode runs asynchronously, your code using my_cords later (setting up myOptions) will see the value of my_cordsbefore the completion callback from geocode runs — and so myOptions.center will be undefined.

If you need my_cords when setting up the myOptions, you'll have to move that code into the callback on geocode.