我正在使用
jquery和Google Maps V3 API动态添加标记到Google地图.单击按钮search_button时,将使用AJAX向服务器发送请求,该请求将返回与结果相对应的LatLng
JSON数组,该数组将用于放置标记.但是在我的
Javascript Conole中,我收到错误：属性< map>：map的值无效.我哪里做错了？这是我的代码：
HTML标头JS：
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(42.354183,-71.065063);
var options = {
zoom: 15,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),options);
}
</script>
jQuery的
$(function() {
$("#search_button").click(function(e){
e.preventDefault();
// Place markers on map
for( i = 0; i < json.length; i++) {
var latLng = new google.maps.LatLng(json[i].lat,json[i].lng);
var marker = new google.maps.Marker({
position: latLng,map: map
});
}
});
});
});
解决方法
你应该将你的变量称为map.这就是全部,实际上我建议将所有内容移动到这样的javascript文件中
$(document).ready(initialize);
var map;
function initialize() {
var latlng = new google.maps.LatLng(42.354183,-71.065063);
var options = {
zoom: 15,mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map($('#map-canvas')[0],options);
$("#search_button").click(function(e){
e.preventDefault();
// Place markers on map
for( i = 0; i < json.length; i++) {
var latLng = new google.maps.LatLng(json[i].lat,map: map
});
}
});
}
