Google Maps: show opened infoboxes/popups
I want some basic information for cities to be available on a Google map. The idea is that when people open the map, they see the information alr开发者_Python百科eady opened, instead of having to click on every marker. Yet I can not figure out if this is something that is possible. I've gone through all samples and have not seen this being employed. Does such an option exist? I attach a visual sample of my intentions.
Can you iterate through all of your Marker objects and call setVisible(true) ? That's what I'd try (I'm only familiar with V3 of the API) e.g.
var marker = new google.maps.Marker({map: map, position:map.getCenter()});
marker.setVisible(true);
The above example shows how to do this for a single Marker, but you can do this to all Markers (maybe hold them in a data structure and iterate through them)
Simply iterate through your marker data on initialization and create info windows based on marker locations.
<html>
<head>
<script type="text/javascript" src= "http://maps.google.com/maps/api/js?sensor=false"></script>
<script>
var map;
//this json contains your raw data as well as space to store created marker and infowindow objects
info = [{
"content": "content 1",
"coords":[-34.397, 150.644],
"marker":null,
"infowindow": null
},{
"content": "content 2",
"coords":[-34.597, 150.644],
"marker":null,
"infowindow": null
}]
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
for(i=0; i<info.length; i++) {
//create markers
pos = new google.maps.LatLng(info[i].coords[0],info[i].coords[1])
marker = new google.maps.Marker({
position: pos,
map: map
});
//store the marker object for later if you want, useful if you want to keep track of your objects or dynamically alter your objects
info[i].marker = marker
infowindow = new google.maps.InfoWindow({
content: info[i].content
});
//store info window object for later if you want, useful if you want to keep track of your objects or dynamically alter your objects
info[i].infowindow = infowindow;
infowindow.open(map,marker);
}
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 320px; height: 480px;">
</div>
</body>
</html>
加载中,请稍侯......
精彩评论