Pan and zoom to display the query results by using Fusion Table Layer

Question

I am beginner in Fusion Table Layer. I would like to display the query results as here (pan and zoom): https://developers.google.com/fusiontables/docs/samples/search_and_zoom ,but I can't do this for my function with AND clause:

function changeMap() {

    var dzialka = document.getElementById('dzialka').value;
    var symbol = document.getElementById('symbol').value;
    var where = '';

    if (dzialka) {
      dzialka = dzialka.replace(/'/g, '\\\'');
      where = "'NUMER' CONTAINS IGNORING CASE '" +
          dzialka + "'";
    }

    if (symbol) {
      if (dzialka) {
        where += ' AND ';
      }
      where += "SYMBOL_OG = '" + symbol + "'";
    }

    layer.setOptions({
      query: {
        select: locationColumn,
        from: tableid,
        where: where
      }
    });
  }

Can someone help me? I will be grateful for your help.

Trebor

score 0 · Answer 1 · answered Apr 18 '12 at 21:57

It is definitely possible to do what you want to do, but it's not that easy. In the example the location to pan to is calculated by the Google Geocoding API using an address. But you don't really have the address (i.e. content of locationColumn) in your JavaScript code. It depends what kind of information you store in the locationColumn, I suppose it's some kind of address that can be geocoded.

Therefore you have to send a select statement directly to Fusion Tables. Google Fusion Tables has a JSONP interface that you can use for this purpose.

var gftUrl = 'http://www.google.com/fusiontables/api/query?';
var jsonUrlTail = '&jsonCallback=?';
var query = 'select ' + locationColumn + ' from ' + tableid + ' where ' + where;
var params = "sql=" + encodeURI(query + jsonUrlTail);

var myCallback = function(data,status) {
    if(status !== 'success') {
        window.alert('Call to Google Fusion Tables failed: ' + status);
        return;
    }
    var address = data.table.rows[0][0];

    /* start code from google example */
    geocoder.geocode({
    address: address
    }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      map.setZoom(10);

      // OPTIONAL: run spatial query to find results within bounds.
      var sw = map.getBounds().getSouthWest();
      var ne = map.getBounds().getNorthEast();
      var where = 'ST_INTERSECTS(' + locationColumn +
          ', RECTANGLE(LATLNG' + sw + ', LATLNG' + ne + '))';
      layer.setOptions({
        query: {
          select: locationColumn,
          from: tableId,
          where: where
        }
      });
    } else {
      window.alert('Address could not be geocoded: ' + status);
    }
    });
    /* end code from google example */
}

var jqxhr = $.post(gftUrl, params, myCallback, "jsonp"); /* jsonp parameter is very important */

In this example I use jQuery for the $.post function.

Have a look at [this answer](http://stackoverflow.com/questions/10206033/search-in-fusion-tables-and-zoom-to-results/10211253#10211253) to a very similar question. This uses the Google Visualization API and is maybe a simpler solution. — Odi, Apr 19 '12 at 06:18

Pan and zoom to display the query results by using Fusion Table Layer

1 Answers1