Possible to iterate through markers after applying a query in a FusionTablesLayer?

Question

I currently have a filter working on a fusion table rendered as a Map Layer, and I want to zoom to best fit all of the data whenever the filter is changed.

I figure I need to wait until the query is applied and then iterate through the markers to find the min/max x & y locations and pan to that rectangle, but I don't see a way in the Maps api to access the markers of a layer.

Anyone have an idea how to do this?

Answer 1

The short answer is no. To me this is one of the shortcomings of dealing with Fusion Tables via the Maps API. E.g. wanting to display a count of the results of my most recent query. But there is a work-around through the "undocumented" JSONP API to Fusion Tables. I've had great success using it but I must credit Robin Kraft with informing me about this API. http://www.reddmetrics.com/2011/08/10/fusion-tables-javascript-query-maps.html.

Here's some code which allows you to re-execute your most recent query via an AJAX JSONP request and do what you want with the results, such as calculating the bounding-box. Note: this example uses Jquery for the AJAX JSONP calls. This example creates a <table> display but can be modified as needed.

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 

// Example call
getFTData(tableid, 'latitude,longitude', example_dataHandler);

<script>
// Globals same for all requests
var queryUrlHead = 'https://fusiontables.googleusercontent.com/fusiontables/api/query?sql=';
var queryUrlTail = '&jsonCallback=?'; // ? could be a function name

// getFTData()
// table_id - Fusion Table id MUST have public permissions
// col_list - comma separated list of FT column names
// successFunction - function to parse the CSV results (see exampleParser below)
//////////////////////////////
function getFTData(table_id, col_list, successFunction) {

    var query = "SELECT " + col_list + " FROM " + table_id;

    var queryurl = encodeURI(queryUrlHead + query + queryUrlTail);

    $.ajax({
        type: "GET",
        url:  queryurl,
        dataType: "jsonp",  // return CSV FustionTable response as JSON
        success: successFunction,
        error: function () {alert("AJAX ERROR for " + queryurl ); }
    });
}
function example_dataHandler(d) {
    // get the actual data out of the JSON object
    var cols = d.table.cols;
    var rows = d.table.rows;
    var row_count = 0;
    var results = '<table border="1" cellpadding="4">';
    results += '<tr>';
    for (var i = 0; i < cols.length; i++) {
        results += '<th>' + cols[i] + '</th>';
    }
    results += '</tr>';
    // loop through all rows to add them to the map
    for (var i = 0; i < rows.length; i++) {

        // Per the expected columns
        results += '<tr>';
        for(j=0; j < rows[i].length; j++)
        {
            results += '<td>' +  rows[i][j] + '</td>';
        }
        results += '</tr>';
        row_count++;
    }
    results += '</table>';
    results += '<br />';

    results += 'Row Count: ' + row_count + '<br />';;
    document.getElementById("program_select").innerHTML = results;
}

</script>

Since retrieving the count of recent Fusion Table rows returned is common, I'm adding a snippet of how to do that.

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

<script type="text/javascript">
var tableid = 3167783

var where = "WHERE type = 9";

getFTCount(current_table_id, where, displayCount);

// Globals same for all request
var queryUrlHead = 'https://fusiontables.googleusercontent.com/fusiontables/api/query?sql=';
var queryUrlTail = '&jsonCallback=?'; // ? could be a function name

///////////////////////////////
// Get Counts from Fusion Tables.
// table_id required
// where  optional  "WHERE column == 'value' " where clause for count()
// successFunction callback required
///////////////////////////////
function getFTCount(table_id, where, successFunction) {
    if(!table_id){
        alert("table_id required."); 
        return;
    }
    if(!successFunction){
        alert("successFunction callback required.");
        return;
    }
    var query = "SELECT count() FROM " + table_id;
    if(where){
        query += ' ' + where;
    }

    var queryurl = encodeURI(queryUrlHead + query + queryUrlTail);

    $.ajax({  
        type: "GET",
        url:  queryurl,
        dataType: "jsonp",  // return CSV FustionTable response as JSON
        success: successFunction,
        error: function () {alert("AJAX ERROR for " + queryurl ); }
    });
}

function displayCount(d) {
    var count = d.table.rows[0]; 
    alert(count);
}
</script>

Answer 2

If your data is in a fusion table, then use the fusion table's sql api to find the Max/Min val for Lat and Lng respectively:

https://www.googleapis.com/fusiontables/v1/query?sql=SELECT  
MINIMUM(Lat) AS MinLat, MAXIMUM(Lat) AS MaxLat,
MINIMUM(Long) AS MinLong, MAXIMUM(Long) AS MaxLong
FROM <table_id>

See here for full details on api: https://developers.google.com/fusiontables/docs/v1/sql-reference. (One thing to remember is to ecodeURI this sql statement)

This returns those for value to json array. And as I'm sure your aware, use these values to set your map's 'center' and 'zoom' parameters.