我有一个位置查找工具,可以从Google Fusion表中提取数据。用户输入他们的地址,然后在匹配其位置的地点/结果处放置一个图钉和信息窗口。 它适用于一个位置,但现在我需要它来显示多个结果/如果它们符合标准则丢弃多个引脚
这里是丢弃一个引脚的工作代码(对不起它很多):
google.load('visualization', '1', {'packages':['corechart', 'table', 'geomap']});
var FusionTableID = 'tableid';
var map = null;
var geocoder = null;
var infowindow = null;
var marker = null;
function initialize() {
geocoder = new google.maps.Geocoder();
infowindow = new google.maps.InfoWindow({size: new google.maps.Size(150,50) });
// create the map
var myOptions = {
zoom: 7,
center: new google.maps.LatLng(41.9908, -93.4208),
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
layer = new google.maps.FusionTablesLayer({
query: {from:FusionTableID},
styles: [{
polygonOptions: {
fillColor:'#000000',
fillOpacity: 0.01,
strokeColor:'#000000',
strokeOpacity: 0.01
}
}],
suppressInfoWindows:true
});
layer.setMap(map);
google.maps.event.addListener(layer, "click", function(e) {
var content = "<b>"+e.row['name'].value+"</b>";
infowindow.setContent(content);
infowindow.setPosition(locationgeocode);
infowindow.open(map);
});
document.getElementById('submit').onclick = function() {
document.getElementById("submit").value = "Searching";
};
}
function showAddress(address) {
var contentString = address+"<br>Outside Area";
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var point = results[0].geometry.location;
contentString += "<br>";
// query FT for data
var queryText ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01));";
// document.getElementById('FTQuery').innerHTML = queryText;
queryText = encodeURIComponent(queryText);
var query = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq=' + queryText);
//set the callback function
query.send(openInfoWindowOnMarker);
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
function openInfoWindowOnMarker(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 content = "<b>Outside of Iowa</b><!--";
var unionBounds = null;
// alert(numRows);
for (var i=0; i < numRows; i++) {
var county = FTresponse.getDataTable().getValue(i,0);
var precinct = FTresponse.getDataTable().getValue(i,1);
var locationname = FTresponse.getDataTable().getValue(i,2);
var locationaddress = FTresponse.getDataTable().getValue(i,3);
var locationcity = FTresponse.getDataTable().getValue(i,4);
var locationstate = FTresponse.getDataTable().getValue(i,5);
var locationzip = FTresponse.getDataTable().getValue(i,6);
var locationgeocode = FTresponse.getDataTable().getValue(i,7);
// var kml = FTresponse.getDataTable().getValue(i,1);
// create a geoXml3 parser for the click handlers
content = "<b>"+locationname+"</b><br />"+locationaddress+"<br />"+locationcity+locationstate+" "+locationzip+"<br/><a href='http://maps.google.com/maps?daddr="+locationaddress+" "+locationcity+" IA "+locationzip+"' target='_blank' >Click here for Directions</a><br /></br></p><!--";
/*
var geoXml = new geoXML3.parser({
map: map,
zoom: false
});
// alert(kml);
geoXml.parseKmlString("<Placemark>"+kml+"<\/Placemark>");
geoXml.docs[0].gpolygons[0].setMap(null);
if (!unionBounds) unionBounds = geoXml.docs[0].gpolygons[0].bounds;
else unionBounds.union(geoXml.docs[0].gpolygons[0].bounds);
*/
}
// zoom to the bounds
// map.fitBounds(unionBounds);
setTimeout(function() {
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
infowindow.setContent(content+marker.getPosition().toUrlValue(6));
google.maps.event.trigger(marker, 'click');
document.getElementById("submit").value = "Search";
}, 150);
geocoder.geocode( { 'address': locationaddress+","+locationcity+locationstate+" "+locationzip}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var point = results[0].geometry.location;
map.setCenter(point);
map.setZoom(12);
if (marker && marker.setMap) marker.setMap(null);
marker = new google.maps.Marker({
map: map,
position: point
});
};
});
}
如果多个查询匹配var queryText ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'Hours', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01));";
任何想法,修复,甚至是正确方向上的一点都会非常有帮助。我真的坚持这个并且已经尝试了几天了。即使是让它打印第二个查询,我可以在表格中标记为第二个位置也会有所帮助。像第二个匹配的东西:
var queryText2 ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'Hours', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01)); AND locationname = 'Location 2'";
谢谢!