0

I'm trying to create links from a text to a marker in a google fusion map. More precisely, I want the map to refresh and zoom on the location selected.

A picture will be easier to understand: http://projeteurope.free.fr/ For example, if you click on "Akrame" on the right side of the page, the map should zoom on the point (which already exist in the fusion table, and is 19 Rue Lauriston, 75016 Paris)

I've look at different topics and websites, but I don't understand how to do that (I'm a total beginner in javascript) Fusion Table + Google Maps or http://alamatku.com/cari?query=UPS&area=jakarta or Google Fusion Tables With Maps - Link Table field to Map Info Window

I just want the map to zoom on a specific market, not to create a new layer with only the marker.

Many thanks if you have any clues! Robin

4

1 回答 1

0

您可以使用GViz（谷歌可视化库）查询融合表并在标记上放大地图。

代码：

function changeQuery(term) {
  layer.setOptions({query:{select:'Latitude', /* was 'Latitude,Longitude', used to work... */
                           from:FT_TableID,
                           where:"Nom contains "+term
                           }

 });

  // zoom and center map on query results
  //set the query using the parameter
  var queryText = encodeURIComponent("SELECT 'Latitude', 'Longitude' FROM "+FT_TableID+" WHERE 'Nom' contains '"+term+"'");
  var query = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq='  + queryText);

  //set the callback function
  query.send(zoomTo);
}

function zoomTo(response) {
if (!response) {
  alert('no response');
  return;
}
if (response.isError()) {
  alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
  return;
} 
  FTresponse = response;
  //for more information on the response object, see the documentation
  //http://code.google.com/apis/visualization/documentation/reference.html#QueryResponse
  numRows = response.getDataTable().getNumberOfRows();
  numCols = response.getDataTable().getNumberOfColumns();

  var bounds = new google.maps.LatLngBounds();
  for(i = 0; i < numRows; i++) {
      var point = new google.maps.LatLng(
          parseFloat(response.getDataTable().getValue(i, 0)),
          parseFloat(response.getDataTable().getValue(i, 1)));
      bounds.extend(point);
  }
  // zoom to the bounds, if you have only one result, 
  // you may want to do a map.setCenter; map.setZoom to specify the behavior
  map.fitBounds(bounds);
}

示例/概念证明

于 2013-01-26T18:51:20.693 回答