Google Maps geoXML3: passing a placemark into it's own event listener?

Question

I'm working on an intranet project, so my KML files can't be externally available. This means I'm dependent on the geoXML3 library to parse my XML on to my Google map. However the lack of documentation around event listeners is frustrating. I want to call a click listener and have the geoXML3 placemark passed in. I'm trying to do the following, however clickListener always receives the last polygon processed in the afterParse loop as p.

kml = new geoXML3.parser({
    suppressInfoWindows: true,
    map: map,
    afterParse: function (doc) {
        for (var i = 0; i < doc[0].placemarks.length; i++) {
            var p = doc[0].placemarks[i];
            google.maps.event.addListener(
                p.polygon,
                "click",
                function () { clickListener(p); }
            );
        }
    }
});
kml.parse(mapSettings.kmlLocation);

If I was using the Google Maps API's KML support, I could do this and have the polygon passed in to the listener.

kml = new google.maps.KmlLayer(mapSettings.kmlLocation, {
    suppressInfoWindows: true,
    preserveViewport: false,
    map: map
});
google.maps.event.addListener(
    kml,
    "click",
    clickListener
};

Is there any way to either (more preferable) pass the correct geoXML3 placemark reliably in to clickListener, or (less preferable) a property in the geoXML3.parser I can bind a click event to and receive a kmlMouseEvent the way I would using the Google Maps API kml parser? Ultimately I need to be able to change the style of the polygon and track that in an array it's been selected/deselected.

score 6 · Accepted Answer · answered Feb 04 '15 at 13:37

Use function closure to associate the placemark with the event listener. One way (you can also use an anonymous function):

kml = new geoXML3.parser({
    suppressInfoWindows: true,
    map: map,
    afterParse: function (doc) {
        for (var i = 0; i < doc[0].placemarks.length; i++) {
            var p = doc[0].placemarks[i];
            clickablePolygon(p);
        }
    }
});
kml.parse(mapSettings.kmlLocation);
function clickablePolygon(p) {
  google.maps.event.addListener(
    p.polygon,
    "click",
    function () { clickListener(p); }
  );
}

Google Maps geoXML3: passing a placemark into it's own event listener?

1 Answers1