Google Maps V3 Infobox undefined on polygons

Question

I have a spoke in my wheels and I am not sure how to sort this out. I have been struggling with it for a couple days and it isn't like a normal infobox as it is not set to a marker rather a polygon which is something new for me. I have polygons that display with data from an XML file and they show up fine. I have searched the web and got it to have the mouseover set up to where you mouseover a polygon the opacity changes and an infobox pops up. Problem is the infobox when it pop up shows "undefined" instead of the html I have set in it to display with data from the XML file.

Here is a link to the test map for example.

http://www.mesquiteweather.net/googlemap_poly.html

Here is a link to the XML file where I am just trying to show the elements events and expires in the info box.

http://www.mesquiteweather.net/xml/warnings_test.xml

This is the code I am working with to create the infoboxes and mouseover events

 function attachPolygonInfoWindow(polygon, html, event, expires)
  {

       var html = "<strong>" + event + "</strong>";

        eventWarnings.infoWindow = new google.maps.InfoWindow({content: html});

       google.maps.event.addListener(eventWarnings, 'mouseover', function(e) {
             var latLng = e.latLng;
                 this.setOptions({fillOpacity:80});
                 polygon.infoWindow.setPosition(latLng);
                 polygon.infoWindow.open(map);
        });

      google.maps.event.addListener(eventWarnings, 'mouseout', function() {
             this.setOptions({fillOpacity:0.35});
             polygon.infoWindow.close();
    });
}

      var polygon = new google.maps.Polygon(/* omitted for brevity */);
                    attachPolygonInfoWindow(eventWarnings);

          eventWarnings.setMap(map);
       }
  });

I am pretty sure it is something easy I am overlooking but I haven't been able to find anything that pertains to my issue. I am just lucky I got the infobox to show at all as I have learned it's tricky since polygons don't have a true center and they are not set up like you would with a marker which I can handle.

If anyone has any suggestions please let me know.

-Thanks

Answer 1

You defined your attachPolygonInfoWindow function with 4 argument, but only provide one when you call it:

 // definition
 function attachPolygonInfoWindow(polygon, html, event, expires)
 ...

 // call
 attachPolygonInfoWindow(eventWarnings);

Probably you want (I don't see the html or expires parameters being used):

attachPolygonInfoWindow(eventWarnings, "", event, null);

The other option would be to change the definition to:

 // definition
 function attachPolygonInfoWindow(polygon, event, expires)

and the call to (assuming you are going to use "expires" for something):

attachPolygonInfoWindow(eventWarnings, event, expires);

As it doesn't look like you need to pass in that parameter (event is serving the function that I would expect it to serve).

Also, FYI, you have a "hanging comma" in your alertColors.js which make IE unhappy...

example