Question

When using 'Google maps v3 plugin for jQuery and jQuery Mobile', how to retrieve the latitude and longitude values under the mouse pointer when clicked on the map?

Was it helpful?

Solution

Even though the click event listener is already added to the map inside the plugin, the event object returned, does not give the latLng value. Adding the click event listener to the map object from my code, worked for me (found the solution by referring this answer).

var map = $('#map_canvas').gmap('get', 'map');
$(map).addEventListener('click', function(event) {
    alert(event.latLng);
});

OTHER TIPS

johansalllarsson's solution works great for me, so here is my sample of code:

<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<script src="js/jquery.ui.map.full.min.js" type="text/javascript"></script> 
<script type="text/javascript">
$(function() {
    $('#map').gmap();
    $($('#map').gmap('get', 'map')).dblclick(function(event) {
        alert(event.latLng);
    });
});
</script>
$($('#map_canvas').gmap('get', 'map')).click(function(event) {
    console.log(event.latLng);
});

see http://jquery-ui-map.googlecode.com/svn/trunk/demos/jquery-google-maps-geocoding.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top