Hi, I am having issues with custom infowindows - using infobox.
I cant seem to figure out how I should close the previous opened
infowindows, without clicking on the X (close button).
When a new marker is clicked, and a infowindow is already opon, I need
that infowindow to close.
So I only have on infowindow open at a time.
Sample code:
<script type="text/javascript" language="javascript">
//map variables
var map;
var adUnit;
var url = "THE URL";
//The function that holds the map
function initgmap() {
//Add marker function
function addMarker(response){
var json = JSON.decode(response);
//Loop though markers only and add them
json.markers.each(function(item){
var latlng = new
google.maps.LatLng(item.lat,item.lng);
var icon = new
google.maps.MarkerImage("ICON");
var marker = new
google.maps.Marker({
position: latlng,
icon: icon,
title: item.label,
map: map,
visible: true
});
var myOptions = {
content: item.html
,disableAutoPan: false
,maxWidth: 0
,pixelOffset: new
google.maps.Size(-140,
0)
,zIndex: null
,boxStyle: {
background:
"url('http://www.garylittle.ca/map/artwork/
tipbox.gif') no-repeat"
,opacity: 0.75
,width: "280px"
}
,closeBoxMargin: "10px
2px 2px 2px"
,closeBoxURL:
"http://www.google.com/intl/en_us/mapfiles/
close.gif"
,infoBoxClearance: new
google.maps.Size(1, 1)
,isHidden: false
,pane: "floatPane"
,enableEventPropagation: false
};
var ib = new InfoBox(myOptions);
google.maps.event.addListener(marker, "click", function() {
ib.open(map, marker);
});
$("loadtext").setStyle("visibility", "hidden");
});
}
//Ajax function to get all markers
function ajaxGet(url){
$("loadtext").setStyle("visibility",
"visible");
var myAjax = new Request({
method: "get",
url: url,
onComplete: addMarker ,
onCancel: function() {
$("loadtext").setStyle("visibility", "hidden");
}
}).send();
}
var latLng = new google.maps.LatLng(56,9);
//The map options
var map = new
google.maps.Map(document.getElementById("gmap"), {
zoom: 7,
center: latLng,
mapTypeControl: true,
mapTypeControlOptions: {
style:
google.maps.MapTypeControlStyle.HORIZONTAL_BAR
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE
},
scaleControl: 1,
panControl: 1,
streetViewControl: 1,
mapTypeId: google.maps.MapTypeId.TERRAIN
});
//The infowindow options
var infowindow = new google.maps.InfoWindow({
size: new google.maps.Size(150,50)
});
//Ajax call to get all markers
ajaxGet(url);
}
// Onload handler to fire off the app.
google.maps.event.addDomListener(window, "load",
initgmap);
</script>
Hope you can help.
regards
Jan
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
