本文介绍了Google API V3 多个信息窗口加上点击关闭的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想出了如何在信息窗口中设置多个标记,但是当您单击另一个标记时它们不会关闭,我相信这是因为我正在为每个标记创建一个新的信息窗口,任何帮助将不胜感激.
I figured out how to have multiple markers with info windows but they do not close when you click another marker, I believe it is because I am creating a new info window for each marker, any help would be appreciated.
<script type="text/javascript">
var map ;
function initialize() {
var latlng = new google.maps.LatLng(53.063165, -3.205390);
var myOptions = {
zoom: 6,
center: latlng,
mapTypeId: google.maps.MapTypeId.SATELLITE,
zoomControl: false,
mapTypeControl: false,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position: google.maps.ControlPosition.LEFT_CENTER
},
panControl: false,
streetViewControl: false,
streetViewControlOptions: {
position: google.maps.ControlPosition.LEFT_CENTER
}
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = add_marker(56.747923,-3.717155,"Ben Vrackie","<b>Ben Vrackie</b><br><br>Perthshire classic! some sweet hidden gems on this loop.<br> surrounded by amazing countryside, Lochs, hills this<br>has it all... Red Grade."); // pass in as Latitude, then Longitude
marker.setMap(map);
var marker = add_marker(57.556366,-5.409222,"Torridon Forest","<b>Torridon Forest</b><br><br>Technical and breathtaking.... <br>Black/red grade."); // pass in as Latitude, then Longitude
marker.setMap(map)
}
function add_marker(lat,lng,title,box_html) {
var infowindow = new google.maps.InfoWindow({
content: box_html
});
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat,lng),
map: map,
title: title
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
return marker;
}
</script>
推荐答案
只创建一个全局 InfoWindow 对象.
Create only one global InfoWindow object.
//Global
var infowindow = new google.maps.InfoWindow();
然后
function add_marker(lat,lng,title,box_html) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat,lng),
map: map,
title: title
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(box_html);
infowindow.open(map,marker);
});
return marker;
}
这篇关于Google API V3 多个信息窗口加上点击关闭的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!