InfoWindow doesnt show

55 views
Skip to first unread message

Rednek

unread,
Feb 22, 2011, 8:02:36 AM2/22/11
to google-map...@googlegroups.com
I have been trying to get the infoWindow to show when I click on a marker. Use to work until I added .push.
Here is what I had when it worked fine:
 
var infowindow = new google.maps.InfoWindow(
  {
    size: new google.maps.Size(150,50)
  });
   
 function createMarker(map, latlng, label, html, color) {
    var contentString = label;
    marker = new google.maps.Marker({
        position: latlng,
        map: map,
        icon: getMarkerImage(color),
        shape: iconShape,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });
 
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString);
        infowindow.open(map,marker);
        });
       
 }
 
Now what I did was in the createMarker function was added .push to markers as you see
 
markers.push(new google.maps.Marker({
        position: latlng,
        map: map,
        shadow: iconShadow,
        icon: getMarkerImage(color),
        shape: iconShape,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        }));
Reason I did that was I wanted to clear markers when I clicked get direction button, thats works, but when I load the page everything loads properly but when I click a marker no infoWIndow shows. Now in the google.maps.event.addListener I changed marker to markers and still doesnt work; heres what I have
 google.maps.event.addListener(markers, 'click', function() {
        infowindow.setContent(contentString);
        infowindow.open(map,markers);
        });
  }
Anyone have an Idea why it doesnt work.
 
Thanks
    Kevin

Andrew Leach

unread,
Feb 22, 2011, 8:45:23 AM2/22/11
to google-map...@googlegroups.com
>  google.maps.event.addListener(markers, 'click', function() {
>         infowindow.setContent(contentString);
>         infowindow.open(map,markers);
>         });
>   }
> Anyone have an Idea why it doesnt work.

"markers" is an array.

You need to work with individual marker objects, so this is needed:
marker = new google.maps.Marker({...})
as you had before.

It should be "var marker" to ensure that it's a local variable. While
"var" is optional, leaving it out can have unforeseen consequences.

Once you have created your marker and have a reference to it (in the
variable "marker"), you can add your event listener to it and push it
on to the array:
google.maps.event.addListener(marker, 'click', function() {...});
markers.push(marker);

What you're doing at the moment is not retaining a reference to each
individual marker.

There are other ways to make it work, for example by adding the
listener to the marker in the array, but it's far easier to keep
dealing with identifiable individual markers and then push each one on
to the array by itself.

Please do bear in mind that although your code snippets seem to have
been enough in this case, that won't necessarily be so and a link to
your map page is always to be preferred. Which is why the posting
guidelines ask for one.

Rednek

unread,
Feb 22, 2011, 9:05:48 AM2/22/11
to google-map...@googlegroups.com
Sorry forgot to post a link here is the page to test it out.

Rednek

unread,
Feb 22, 2011, 9:14:11 AM2/22/11
to google-map...@googlegroups.com
Andrew;
 
Thanks alot changed it to what you advised me to do and everything works great now. Again Thanks alot.
 
        Kevin
Reply all
Reply to author
Forward
0 new messages