The right click event for the Map returns a MouseEvent which in includes the LatLng. I am using it in that instance.
However, the method also handles the right click for a Marker which returns an Event not a MouseEvent. Event does not include a LatLng so I have to make the calculation then. http://code.google.com/apis/maps/documentation/javascript/reference.html #Marker I left this out of my code sniplet. This is my modification to GeoXml3 that adds the rightclick event to the marker. if (parserOptions.rightClickFunction != null) { google.maps.event.addListener(marker, 'rightclick', parserOptions.rightClickFunction); } Kevin Jones TransCore 770-246-6227 From: [email protected] [mailto:[email protected]] On Behalf Of Nathan Raley Sent: Thursday, December 16, 2010 5:35 PM To: [email protected] Subject: Re: [Google Maps API v3] How to get latitude and longitude from marker right click event Also, why are you calculating the pixel coordinates and translating to lat/lng when the click event itself provides you with lat/lng of the point clicked or the marker clicked? On Thu, Dec 16, 2010 at 4:30 PM, Nathan Raley <[email protected]> wrote: Why aren't you passing the event to the function so the function call has access to the properties triggered by the event? On Thu, Dec 16, 2010 at 3:13 PM, Kevin <[email protected]> wrote: How do you determine the coordinates of the marker clicked on in it's right click event handler? And an even bigger question, how do you make it work for all browsers? My scenario: When a marker is right clicked, display a context menu at the marker and save the latLon coordinates for later use. When "Zoom in" to marker is selected on the context menu, center the map on the saved coordinates and zoom in. My problem: The coordinates I am saving are wrong for all browsers except IE. I am able to calculate the right pixel location for displaying the context menu. That works in IE, Firefox, Chrome & Safari. But the lat lon coords I am calculating from that pixel position are wrong for all browsers except IE. Javascript: var _googleMap = null; var _overlayView = null; // This will be useful in getting latLon from pixel in map's container function load() { var mapTypes = new Array(); mapTypes.push(google.maps.MapTypeId.ROADMAP); mapTypes.push(google.maps.MapTypeId.HYBRID); mapTypes.push(google.maps.MapTypeId.TERRAIN); var latlng = new google.maps.LatLng(cityLatitudeCenter, cityLongitudeCenter); var myOptions = {zoom: 8, center: latlng, mapTypeControlOptions: { mapTypeIds: mapTypes }, mapTypeId: google.maps.MapTypeId.TERRAIN }; _googleMap = new google.maps.Map(document.getElementById("googlemap"), myOptions); google.maps.event.addListener(_googleMap, 'zoom_changed', CheckZoom); google.maps.event.addListener(_googleMap, 'bounds_changed', SetDefaultMap); // Saves map position to cookie google.maps.event.addListener(_googleMap, 'center_changed', SetDefaultMap); // Saves map position to cookie google.maps.event.addListener(_googleMap, 'rightclick', showContextMenu); google.maps.event.addListener(_googleMap, 'click', hideContextMenu); _overlayView = new google.maps.OverlayView(); _overlayView.draw = function() { }; _overlayView.setMap(_googleMap); loadKMLFiles(); // uses GeoXML3 to parse and place markers on map via v3 api } // === Global variable that can be used by the context handling functions == var clickedLatLng; markerContextHtml = '<div>' + '<a href="javascript:zoomIn()"><div class="context" onmouseover=this.style.backgroundColor=\'#A0A0A4\' onmouseout=this.style.backgroundColor=\'#ffffff\'> Zoom In to Location <\/div><\/a>' + '<a href="javascript:zoomOut()"><div class="context" onmouseover=this.style.backgroundColor=\'#A0A0A4\' onmouseout=this.style.backgroundColor=\'#ffffff\'> Zoom Out to State <\/div><\/a>' + '<\/div>'; function showContextMenu(event) { // This method is called by both a right click event on the map and a right click on a marker. // The marker mouseevent does not include latitude longitude coordinates var x; var y; // Get clicked pixel location if (event.pixel != null) { // Map mouse event returns pixel in event x = event.pixel.x; y = event.pixel.y; } else if (BrowserDetect.browser == "Explorer") { // Marker event for IE returns pixel in event as x and y x = event.x; y = event.y; } else if (BrowserDetect.browser == "Mozilla") { // Marker event for Mozilla - must calculate x,y pixel position x = event.clientX - _googleMap.getDiv().offsetLeft - window.scrollX; y = event.clientY - _googleMap.getDiv().offsetTop - window.scrollY; } else { // Marker event for other browsers (tested for Chrome and Safari) - must calculate x,y pixel position x = event.pageX - _googleMap.getDiv().offsetLeft; y = event.pageY - _googleMap.getDiv().offsetTop; } // Store latLng for later user if (event.latLng != null) { // Click event on map clickedLatLng = event.latLng; } else { // Click event on marker doesn't contain LatLon. Derive latLon from clicked pixel in map's container var xy = new google.maps.Point(x, y); clickedLatLng = _overlayView.getProjection().fromDivPixelToLatLng(xy); //clickedLatLng = new google.maps.LatLng(this.position.lat(), this.position.lon()); } // Adjust the context menu location if near an edge if (x > _googleMap.getDiv().offsetWidth - 120) { x = _googleMap.getDiv().offsetWidth - 120 } if (y > _googleMap.getDiv().offsetHeight - 100) { y = _googleMap.getDiv().offsetHeight - 100 } // Set context menu position contextmenu.innerHTML = markerContextHtml; contextmenu.style.position = "absolute"; contextmenu.style.left = x.toString() + "px"; contextmenu.style.top = y.toString() + "px"; contextmenu.style.visibility = "visible"; // Add context menu to the map $(_googleMap.getDiv()).append(contextmenu); } function zoomIn() { // perform the requested operation _googleMap.setCenter(clickedLatLng); _googleMap.setZoom(_maxZoomLevel / 1); // divide by one to convert to number // hide the context menu now that it has been used hideContextMenu(); } -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected] <mailto:google-maps-js-api-v3%[email protected]> . For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en. -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en. -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
