Problem with Javascript Menus on Google Map API using fusiontables
Right now I am currently creating a map that will have a javascript menu allowing users to change to different map views using the Google fusion table overlays. I would really appreciate it if you could help me out with a problem that is preventing me from completing the project.
This is my Google Maps HTML Page:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<!DOCTYPE html>
<title>Met Sacramento Internship Map</title>
<!-- Style -->
<style>
body { font-family: Arial, sans-serif; }
#map_canvas { height: 500px; width:600px; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js开发者_运维知识库?sensor=false"></script>
<script type="text/javascript">
var tableid = 567682;
var layer = new google.maps.FusionTablesLayer(567682);
function initialize() {
var latlng = new google.maps.LatLng(37.5213829, -122.172534);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
layer.setMap(map);
}
//Change the query based on the user's selection
function changeMap(delivery) {
layer.setQuery("SELECT Address FROM " + tableid + " WHERE delivery LIKE '" + delivery + "'");
}
</script>
</script>
</head>
<body onload="initialize();">
Internship Status <select onchange="changeMap(this.value);">
<option value="%">--Select--</option>
<option value="ANIMALS">Animals</option>
<option value="BUSINESS">Business</option>
</select> <div id="map_canvas"></div>
</body>
</html>
My problem occurs when I add this code:
//Change the query based on the user's selection
function changeMap(animals) {
layer.setQuery("SELECT Address FROM " + tableid + " WHERE Animals LIKE '" + Animals + "'");
Any help would be greatly appreciated, I am fairly new to fusion tables, the Google Maps API, and Javascript.
Looking at table 567682, I don't see a column named "Animals". Make sure that your table contains a column named "Animals" with values "ANIMALS" and "BUSINESS" in it, since your WHERE clause is filtering on that column.
The variable Animals is not spelled correctly. In the function header you write it with lower A "animals" whereas in the query you refer with upper case "Animals"...
Looks like that Fusion table isn't playing nice with your LIKE SQL operator, even though google says it's supported
I got it working by changing the query to use CONTAINS and option values like this:
layer.setQuery("SELECT Address, 'Interest Area' FROM " + tableid + " WHERE 'Interest Area' CONTAINS '" + delivery + "'");
<option value="Animals">Animals</option>
<option value="Business">Business</option>
精彩评论