Yea, I just got back to my computer and saw your post. I was going to tell you the marker has a getPosition that returns you its lat/lng. Congrats on finding it yourself.
I would assume the fromDivPixelToLatLon was not being passed the right values or something along those lines. However, you didn't post a link so we can't see exactly how your code was behaving. However, I was going to recommend using the inverse from that and taking the lat/lng and converting that to Pixel X,Y if you were needing the pixels as you know your lat/lng are going to be correct. There are a lot of factors that come into play when you are converting from lat/lng to Pixel or Tile X,Y and vice versa. The Google documentation goes into some detail about how these are determined and I found a nice read on Bing Maps documentation that goes into a bit more detail that I found easier to understand. They both use Mercator projection so the same principles apply to both. On Fri, Dec 17, 2010 at 9:05 AM, Jones, Kevin <[email protected]>wrote: > Okay, I’ve got. Hopefully, this will help someone else. > > > > The best way to add the event listener is like this > > google.maps.event.addListener(marker, 'rightclick', > function(event) { markerRightClick(event, marker.getPosition()) }); > > Not like this > > google.maps.event.addListener(marker, 'rightclick', > markerRightClick); > > > > Now you don’t have to keep a dummy OverlayView and deal with the projection > like in other posts. > > > > The rest of the code is like this > > > > function mapRightClick(mouseEvent) { > > > > clickedLatLng = mouseEvent.latLng; // Save for context menu “Zoom In” > > > > showContextMenu(mouseEvent.pixel.x, mouseEvent.pixel.y); > > } > > > > function markerRightClick(event, LatLon) { > > var x; > > var y; > > > > 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; > > } > > > > clickedLatLng = LatLon; // Save for context menu “Zoom In” > > > > showContextMenu(x, y); > > } > > > > function showContextMenu(x, y) { > > > > // 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); > > } > > > > I am still curious why fromDivPixelToLatLon() was not working in the other > browsers. However, I am will to let that go for the sake of getting other > things done. > > > > > > *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]<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]<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]<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.
