JavaScript getting variable from one function to another

Question

I am having issues passing two coordinates from one function to another. I don't really know JavaScript, but it seems to be somewhat correct. Could you please let me know where is my error?

        <script type="text/javascript"> 

        function initialize() {
            var address = "Chicago IL";
            locs= getLatLong(address);

            alert(locs.lat()); //does not work
            var myOptions = {
                zoom: 4,
                center: new google.maps.LatLng(41, -87),
                mapTypeId: google.maps.MapTypeId.ROADMAP          
            };

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

        function getLatLong(address){
            var geo = new google.maps.Geocoder;
            geo.geocode({'address':address},function(results, status){
                if (status == google.maps.GeocoderStatus.OK) {

                    locations[0] = results[0].geometry.location.lat(); 
                    locations[1] = results[0].geometry.location.lng();                  

                    //alert(locations[0]); //test is good- works! Need to pass it back to function
                    //alert(locations[1]); //test is good- works! Need to pass it back to function
                    locs =results[0].geometry.location; 
                    return locs;                
                } else {
                    alert("Geocode was not successful for the following reason: " + status);
                }
            });
        }
    </script>

I asked a similar question that might help you to understand some basic (yet difficult at first) to understand: stackoverflow.com/questions/8436358/understanding-local-scope — ajax333221
– ajax333221, Commented Jan 17, 2012 at 6:43

Tomalak · Accepted Answer · 2012-01-17 06:44:25Z

2

It is not possible to return a value from an asynchronous function. Do not try it.

Use a callback instead.

function setLocationOnMap(locs) {
    alert(locs.lat()); // works now!
    var myOptions = {
        zoom: 4,
        center: new google.maps.LatLng(41, -87),
        mapTypeId: google.maps.MapTypeId.ROADMAP          
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 
}

function initialize() {
    var address = "Chicago IL";
    getLatLong(address, setLocationOnMap);
}

function getLatLong(address, callback){
    var geo = new google.maps.Geocoder;
    geo.geocode({'address':address},function(results, status){
        if (status == google.maps.GeocoderStatus.OK) {
            // processing...
            locs = results[0].geometry.location; 

            callback(locs);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}

You must understand that asynchronous function calls like geo.geocode() return immediately, i.e. before any result is ready. That's why you can't use return to return a value from them - they don't have it yet.

Once the result (most often, an HTTP request) is ready, the asynchronous function relies on a callback function to handle it. You must do all your further processing in that callback function, either directly or by making another function call.

edited Jan 17, 2012 at 6:44

answered Jan 17, 2012 at 6:34

Tomalak

339k68 gold badges547 silver badges635 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Andrew Over a year ago

Folks, I am quite confused. I need to add some markers on this map, and it it required to get into for loop and ack additional locations for other cities. How can I get them with callback? Sorry,I understand passing objects and variables, but never encountered calback concept before $ var position = new google.maps.LatLng(locs.lat(), locs.lng()); var marker = new google.maps.Marker({ position: position, map: map }); marker.setTitle("Chicago, IL");

Tomalak Over a year ago

To set N markers you need N requests to geocode(), so there's your loop. The geocode() function already accepts a callback (note the function() you pass as an argument?). Just use this callback to set your markers.

Collectives™ on Stack Overflow

JavaScript getting variable from one function to another

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related