我的问题出在 WP-Plugin 中,我写道,当同时打开多个 map 时,
例如在主页上显示最后 3 个帖子,每个帖子都有一个显示其位置的小 map ,
当我点击其中一个标记时,无论在哪张 map 上,信息窗口都会显示在最后一张 map 中......
我使用以下代码初始化 map :
function Initialize(lat, lng, zm, pid) {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(lat,lng);
var mapOptions = {
zoom: zm,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var name = "map_canvas" + pid;
map = new google.maps.Map(document.getElementById(name), mapOptions);
}
并按如下方式设置标记:
function AddMarker( lat, lng, address, title, link, image, target ) {
var marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(lat, lng),
icon: new google.maps.MarkerImage( image ),
title: title
});
var infowindow = new google.maps.InfoWindow({
content: '<a href="' + link + '" target="_' + target + '">' + title + '</a><br /><small><font color="#000000">' + address + '</font></small>',
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
var map
位于函数文件的顶部,有点像全局,因此标记都在正确的 map 上,但遗憾的是信息窗口不会跟随它们......
还有其他人经历过这样的事情,或者知道我如何解决它吗?
最佳答案
你的问题是这样的:
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
单击 map 时访问 map
变量,而不是分配处理程序时访问变量的值。传递一个副本并使用它:
google.maps.event.addListener(marker, 'click', (function (m) {
return function() {
infowindow.open(m,marker);
};
}(map)));
编辑:
上面使用立即调用的函数表达式来传入 map
变量的副本。这一切所做的就是声明一个函数,然后立即调用它,并传入 map
。
function (m) {
return function() {
infowindow.open(m,marker);
};
}(map)
但是,整个内容需要包装在 ()
中,以便 JS 解析器将其读取为函数表达式而不是函数声明。
解决这个问题的另一种方法是:
function AddMarker( lat, lng, address, title, link, image, target ) {
var marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(lat, lng),
icon: new google.maps.MarkerImage( image ),
title: title
});
var infowindow = new google.maps.InfoWindow({
content: '<a href="' + link + '" target="_' + target + '">' + title + '</a><br /><small><font color="#000000">' + address + '</font></small>',
});
// Add a function that returns a new function that uses a local
// copy of the passed in map.
var getMapClickListener = function (m) {
return function () {
infowindow.open(m, marker);
};
};
// Then use the new function when adding the handler.
google.maps.event.addListener(marker, 'click', getMapClickListener(map));
}
关于javascript - Google map 信息窗口显示在错误的 map 上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21021409/