multiple markers with click action

1,641 views
Skip to first unread message

P

unread,
Jun 30, 2010, 8:17:32 PM6/30/10
to Google Maps JavaScript API v3
this should be really simple, yet I have spent TWO hours trying to
figure it out... to no avail:

I simply need to populate my map with multiple markers. each marker
should have a infowindow that displays some information about it.

I'm having trouble figuring out where to put my listener and click
functions... in relation to the setMarkers function. obviously, I'm no
javascript genius so please go easy on me.

code:

<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(37.4419, -32.1419);
var myOptions = {
zoom: 1,
center: latlng,
mapTypeId: google.maps.MapTypeId.SATELLITE
};
var map = new
google.maps.Map(document.getElementById("map_canvas"), myOptions);

setMarkers(map, tsunamis);

}

var tsunamis = [
['Tsunami 1', -33.890542, 151.274856, 4, 'Tsunami 1 text'],
['Tsunami 2', -33.923036, 151.259052, 5, 'Tsunami 2 text'],
['Tsunami 3', -34.028249, 151.157507, 3, 'Tsunami 3 text'],
['Tsunami 4', -33.950198, 151.259302, 1, 'Tsunami 4 text']
];

function setMarkers(themap, locations) {

for (var i = 0; i < locations.length; i++) {
var tsunami = locations[i];
var myLatLng = new google.maps.LatLng(tsunami[1], tsunami[2]);
var marker = new google.maps.Marker({
icon: '/images/wave_icon.png' ,
position: myLatLng,
map: themap,
title: tsunami[0],
zIndex: tsunami[3]
});
google.maps.event.addListener(marker, 'click',
listenerHandler(i,themap,marker));
}
}

function listenerHandler(which,themap,marker) {
var infowindow = new google.maps.InfoWindow({ content:
tsunamis[which][4] });
infowindow.open(themap,marker);
}

</script>

(this pops up all 4 markers (with their infowindow already open –
 since it is called from the setMarkers function on load...). yet
clicking on markers doesn't work!

so, I'd like to have no infowindow show on load and enable the click
to show them.

thanks!

geoco...@gmail.com

unread,
Jun 30, 2010, 10:40:09 PM6/30/10
to Google Maps JavaScript API v3

P

unread,
Jul 1, 2010, 1:36:20 AM7/1/10
to Google Maps JavaScript API v3
yes. thank you larry. I have it working now (although with another
issue that I brought up in another thread).

thanks again!




On Jun 30, 7:40 pm, "geocode...@gmail.com" <geocode...@gmail.com>
wrote:

Nathan Raley

unread,
Jul 1, 2010, 3:35:57 PM7/1/10
to google-map...@googlegroups.com
What was the other issue?

--
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 google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.


cap10devNull

unread,
Jan 24, 2012, 11:25:21 PM1/24/12
to google-map...@googlegroups.com
thanks that helped , I was trying to color and draw polylines, overlays

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
             drawingComplete(event); });

function drawingComplete(event)
       {
           var kpoly = event.overlay;
           //console.log(kpoly);
           polys.push(kpoly);
           google.maps.event.addListener(kpoly, 'click', function() {
                    kpoly.setOptions( { strokeColor: kolor, } );              
               });
          
       }

Reply all
Reply to author
Forward
0 new messages