目前我正在创建一个地图,其中包含一个javascript菜单,允许用户使用Google Fusion表格叠加更改为不同的地图视图。如果你能帮助我解决妨碍我完成项目的问题,我将非常感激。
这是我的Google地图HTML页面:
<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>
添加此代码时出现问题:
//Change the query based on the user's selection
function changeMap(animals) {
layer.setQuery("SELECT Address FROM " + tableid + " WHERE Animals LIKE '" + Animals + "'");
非常感谢任何帮助,我对融合表,Google Maps API和Javascript相当新。
答案 0 :(得分:0)
查看表567682,我没有看到名为“Animals”的列。确保您的表中包含名为“Animals”的列,其中包含值“ANIMALS”和“BUSINESS”,因为您的WHERE子句正在对该列进行过滤。
答案 1 :(得分:0)
变量Animals没有拼写正确。在函数标题中,您使用较低的A“animals”编写它,而在查询中您使用大写的“Animals”...
答案 2 :(得分:0)
看起来,即使google says it's supported
,您的LIKE SQL运算符也无法使用Fusion表。我通过更改查询以使用CONTAINS和选项值来实现它:
layer.setQuery("SELECT Address, 'Interest Area' FROM " + tableid + " WHERE 'Interest Area' CONTAINS '" + delivery + "'");
<option value="Animals">Animals</option>
<option value="Business">Business</option>