gmaps.js - 如何使用select过滤标记？

Question

我可以使用Google Maps JS过滤没有gmaps.js的标记。但是，下面的代码不能与gmaps.js一起使用。错误声明：changeMap不是函数。我的业余JS级别无法弄清楚。有任何想法吗？

我现在用gmaps.js

$(document).ready(function(){ 
var layer; 
var tableid = 2796050; 
var map = new GMaps({ 
el: '#map_canvas', 
lat: 33.68906, 
lng: -78.886694, 
zoom: 11 
}); 
infoWindow = new google.maps.InfoWindow({}); 
map.loadFromFusionTables({ 
query: { 
select: '\'Location\'', 
from: '1LNKdPBYZOlszyjQqzUhoqsQXVdkyQ7pP2o2ft9o' 
}, 
suppressInfoWindows: false, 
events: { 
click: function(point){ 
infoWindow.setPosition(point.latLng); 
} 
} 
}); 
// problem area 
function changeMap() { 
var searchString = document.getElementById('search-string').value.replace(/'/g, "\\'"); 
if(!searchString) { 
layer.setQuery("SELECT 'Latitude' FROM " + tableid); 
return; 
} 
layer.setQuery("SELECT 'Latitude' FROM " + tableid + " WHERE 'Category' = '" + searchString + "'"); 
} 
}); 

HTML

<!-- HTML --> 
<form> 
<label>Category </label> 
<select id="search-string" onchange="changeMap(this.value);"> 
<option value="">All Places</option> 
<option value="Attractions">Attractions</option> 
<option value="Dining">Dining</option> 
<option value="Shopping">Shopping</option> 
<option value="Services">Services</option> 
</select> 
</form> 

Answer 1

对于这个工作不正确JS，你需要的HTML数据之前添加<script>块。

既然您正在使用jQuery，请考虑编写事件而不是changeMap函数。首先，从select中删除onchange属性。而改变这种：

function changeMap() { 
    var searchString = document.getElementById('search-string').value.replace(/'/g, "\\'"); 
    if(!searchString) { 
     layer.setQuery("SELECT 'Latitude' FROM " + tableid); 
     return; 
    } 
    layer.setQuery("SELECT 'Latitude' FROM " + tableid + " WHERE 'Category' = '" + searchString + "'"); 
} 

...这样的：

$('#search-string').change(function() { 
    var searchString = document.getElementById('search-string').value.replace(/'/g, "\\'"); 
    if(!searchString) { 
     layer.setQuery("SELECT 'Latitude' FROM " + tableid); 
     return; 
    } 
    layer.setQuery("SELECT 'Latitude' FROM " + tableid + " WHERE 'Category' = '" + searchString + "'"); 
}) 

更多信息：http://api.jquery.com/change/