Question

Can some one explain the meaning of the following code snippet (jQuery.fn[name]) found in the google jquery.ui.map plugin:

jQuery.each(('click mousedown rightclick dblclick mouseover mouseout drag dragend').split(' '), function(i, name) {
    jQuery.fn[name] = function(a, b) {
        return this.addEventListener(name, a, b);
    };
});

And also how we could bind a callback function to the click event on a map object, I have tried the following but the event does not have the latLng attribute:

$('#map_canvas').gmap().click(function(event) {
        alert(event.latLng);
    });

Thanks in advance.

Answer 1

That snippet of code overwrites some of the jQuery methods so that it can be used on some Google Maps objects. E.g.

    var map = $('#map_canvas').gmap('get', 'map')
    $(map).click(function() {
        var self = this; // this is the map object
    });

    $('#map_canvas').gmap('addMarker', { ... }).click(function() {
        var self = this; // this refers to the marker object
    }).hover(function() {
         var self = this; // this refers to the marker object
    });

If you need to bind other events such as zoom_changed then just

var map = $('#map_canvas').gmap('get', 'map');
$(map).addEventListener('zoom_changed', function() {

});