fitBounds and extend - showing up at a completely different place

Question

var classBounds = new google.maps.LatLngBounds();
var query = "";

query = "SELECT 'ROAD_NUMBER', 'geometry' FROM [TABLE_ID HERE] WHERE 'ROAD_NUMBER' CONTAINS IGNORING CASE '" + searchString + "' AND 'LINK_NUMBER' CONTAINS '" +searchStringLinkNo + "'";
var encodedQuery = encodeURIComponent(query);

// Construct the URL
var url = ['https://www.googleapis.com/fusiontables/v1/query'];
url.push('?sql=' + encodedQuery);
url.push('&key=[key]');
url.push('&callback=?');


// Send the JSONP request using jQuery
$.ajax({
    url: url.join(''),
    dataType: 'jsonp',
    success: function (data){

        var rows = data['rows'];

        if(rows){

            var classRoadGeo1       = rows[0][1].geometry.coordinates;
            var classRoadGeo2       = rows[rows.length - 1][1].geometry.coordinates;
            var classRoadGeoStart   = classRoadGeo1[0];
            var classRoadGeoEnd     = classRoadGeo2[classRoadGeo2.length - 1];

            var startHolder = classRoadGeoStart.toString();
            var endHolder = classRoadGeoEnd.toString();

            var bound1 = startHolder.split(",");
            var bound2 = endHolder.split(",");

            var coordinate1 = new google.maps.LatLng(bound1[1], bound1[0]);
            var coordinate2 = new google.maps.LatLng(bound2[1], bound2[0]);

            alert(bound1);
            alert(bound2);

            classBounds.extend(coordinate1);
            classBounds.extend(coordinate2);                

        }
        else{

            alert("Unable to locate any counter/classifier stations for the current selection.");
        }
    }
}); 

map.fitBounds(classBounds);

}

All the code is above. I have taken the geometry out of the fusion table, converted it back to string and made a LatLng object out of it. However, when I run fitBounds, it takes me to Papa New Guinea, when the coordinates are actually for Kiama in Sydney, Australia. I'm getting no errors. Any ideas on what might be wrong?

Answer 1

The ajax request is asynchronous, so when map.fitBounds() is called, the bounds havent been extended yet. Put the last line "map.fitBounds(classBounds);" at the end of your if clause inside the success function and it should work fine.