Google Maps API V3: fromContainerPixelToLatLng

Question

I am currently working on a project that requires that I have a div laid out on Google Map. However, I need to pass the mousemovediv event to the map. To do this, I need to find the LatLng coordinates from the pixel coordinates of the map container (since mousemoveLatLng coordinates are required to trigger the Maps event ).

Is there any other way to pass the mousemove event from the div to the map, and if not, how can I go from the coordinate of the Map container to LatLng. I read that this requires the creation of a fictitious overlay, and then with the help of getProjection()this to get MapCanvasProjectionand finally call fromContainerPixelToLatLng(). Is there an easier way or do I really need to create a dummy overlay first?

Answer 1

As far as I can tell, so you should do it. At first I was also reluctant, as it seemed such an overkill, but as soon as I did it, everything worked perfectly. Here is an example implementation with a convenient callback delayedInit():

function Dummy(map) {
    this.setMap(map);
}
Dummy.prototype = new google.maps.OverlayView();
Dummy.prototype.draw = function() {
    if (!this.ready) { 
        this.ready = true; 
        google.maps.event.trigger(this, 'ready'); 
    } 
}
Dummy.prototype.onAdd = function(){
    // the Overlay dummy is ready and can be called upon
    delayedInit();
}
var dum;

... and after creating your Google map:

dum = new Dummy(map);