My favorites ▼ | Sign in
Project Home Issues
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 1702: Incorrect latLng reported in click & dblclick events when there is a scroll offset in a parent element
8 people starred this issue and may be notified of changes. Back to list
Status:  Fixed
Owner:  ----
Closed:  Sep 2009


Sign in to add a comment
 
Reported by [email protected], Sep 14, 2009 
* Description:

The value of the "latLng" property of the event object, passed to the event
handler of a "click"-event, contains incorrect latitude and longitude
values when a parent DOM-element of the map's canvas has scrollTop or
scrollLeft. Sample HTML code is provided at the end of the report.

* Tested under:

- Firefox 3.5, Mac OS X 10.6.1
- Safari 4, Mac OS X 10.6.1

* Expected result:

I expect to see a marker at the position of my click each time I click, no
matter if the page was scrolled or not.

* Actual result:

If the page is scrolled, the marker is positioned wrongly, offset of the
position one would expect it to be by the amount the page was scrolled. The
marker itself is positioned correctly, but the latLng property of the event
object passed to the event handler is computed wrongly. Probably it does
not take into account the scrollTop & scrollLeft properties of its ancestors.

* Steps to reproduce -- use the sample HTML below, or:

1. Create a map and hook to the "click"-event
2. Scroll the page with the map a bit
3. Click on the map to trigger a "click"-event and observe the value of the
latLng property of the event object, passed to the event handler.


Here is a simple HTML, that I have used to verify the problem:

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Event Simple</title>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
	// create a map and a marker
	var map = new google.maps.Map(document.getElementById("map_canvas"), {
		zoom: 4,
		center: new google.maps.LatLng(-25.363882, 131.044922),
		mapTypeId: google.maps.MapTypeId.ROADMAP
	});
	var marker = new google.maps.Marker({map: map});

	google.maps.event.addListener(map, 'click', function(e) {
		var point = e.latLng;
		if (point && marker) {
			marker.set_position(point);
		}
	});

	// scroll down the page a little bit
	var scrollTarget = document.getElementById('instructions');
	if (scrollTarget && scrollTarget.scrollIntoView) {
		scrollTarget.scrollIntoView();
	}
}
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">

	<div id="spacer" style="height: 30px"></div>

	<div id="instructions">
		<h3>Steps to reproduce:</h3>
		<ul>
			<li>Ensure the page is scrolled down a little bit.</li>
			<li>Click on the map to place a marker.</li>
			<li>The marker is positioned wrongly, offset by the amount of the scroll
offset.</li>
		</ul>
	</div>

	<div id="map_canvas" style="width:100%; height: 450px;"></div>

	<div style="height: 2000px;"></div>
</body>
</html>
Sep 14, 2009
#1 d.l%[email protected] 
Is this possibly the same issue as  Issue 1700 ?
Sep 14, 2009
#2 [email protected] 
I am not able to debug the issue and determine the actual cause of it, but I have to
guess that (even though it may be possible for the two issues to be related), since
this issue exists both on FF and Safari, it probably has different root cause.

I can't think of any way to check if these symptoms are caused by the same faulty
code. If there are any tests I could perform, I am willing to do so.
Sep 16, 2009
#3 d.l%[email protected] 
Thanks for the followup.

Note that I was able to reproduce the bug described in  Issue 1700  on Safari by adding
a margin offset to the map canvas.  My instincts are telling me the two bugs are
closely related with the same root cause.  They're just manifesting themselves in
multiple ways.

Nonetheless, I've filed this as a separate issue internally with a note stating the
two issues may be the same.


Thanks!
Status: Confirmed
Labels: Internal-2125765
Sep 16, 2009
#4 d.l%[email protected] 
 Issue 1694  has been merged into this issue.
Sep 16, 2009
#5 d.l%[email protected] 
(No comment was entered for this change.)
Labels: Browser-FF Browser-Safari
Sep 18, 2009
#6 d.l%[email protected] 
(No comment was entered for this change.)
Status: FixedNotReleased
Sep 18, 2009
#7 d.l%[email protected] 
 Issue 1695  has been merged into this issue.
Sep 22, 2009
#8 [email protected] 
Great thanks for fixing this bug in FF :)
Sep 22, 2009
#9 d.l%[email protected] 
(No comment was entered for this change.)
Status: Fixed
Labels: Fixed-16
Oct 8, 2009
#10 d.l%[email protected] 
 Issue 1729  has been merged into this issue.
May 10, 2011
#11 [email protected] 
I am experiencing this issue in Mobile Safari (iPod Touch 4, iOS 4.2.1)

I have tested with the sample code included in the issue description, although placing a marker doesn't work with the sample code, pinch-to-zoom and dblclick-to-zoom is affected by the same issue.
May 10, 2011
#12 [email protected] 
Since the time I have posted this bug report, the API changed and I believe that set_position() is now setPosition() (though I haven't checked and/or tested it this way).
May 10, 2011
#13 [email protected] 
You are correct. I updated the code and can confirm the issue with markers in Mobile Safari, too.
May 31, 2011
#14 [email protected] 
I am also experiencing this issue on iPhone iOs 4.3.3 and iPad 4.3.3
Jun 22, 2011
#15 [email protected] 
same here: iPad 4.3.3
Jul 8, 2011
#16 [email protected] 
I am having the same issue with multiple maps on ipad4.3.3/safari
► Sign in to add a comment

Powered by Google Project Hosting