I'm trying to work out why the StreetView controls don't appear in Chrome browser when StreetView is opened programmatically but they do appear when StreetView is displayed by using the pegman...
Here's the map:
http://beta.findtoilet.dk/?term=2&lat=55.678937&lng=12.575738&zoom=15&maptype=roadmap
Drag pegman to show StreetView and it works perfectly.
You can see the top-right close button, the zoom and compass controls and the bottom left and right Google links.
Now open the infowindow by clicking a marker or a sidebar item.
The infowindow contains a link to open StreetView for that marker - give that link a click.
StreetView displays but none of the controls are visible, neither are the two bottom Google links.
Yet if you hover the mouse where the controls would be displayed the mouse click works just as if the controls were visible.
If you hover the mouse top right until it turns into apointing hand and click where the zoom control would be, the StreetView will zoom in or out and while zooming you can see all of the invisible controls.
Everything works fine with Firefox and IE9.
I'm using the latest versions of all browsers on a 64 bit Windows 7 pc, another person has reported the same problem on 32 bit Windows XP.
I've tried to use the Chrome developer tools but see nothing that would cause the controls to not be visible.
This usedto work fine in Chrome so i'm not sure if the problem is related to a Chrome update or a change in the Google Maps API - no changes have been made to the map javascript recently.
Can anyone suggest what might be wrong?
Thanks.
Martin.
The problem seems to be with -webkit-transform:scale(1) that you apply to the #toiletMap div[style].
Removing this, it fixes the problem..
alternatively, you can add translateZ(0) to fix the problem.
-webkit-transform:scale(1) translateZ(0);
Update
It must be related to
http://code.google.com/p/gmaps-api-issues/issues/detail?id=3928&q=webkit%20Transform&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Stars%20ApiType%20Internal
http://code.google.com/p/gmaps-api-issues/issues/detail?id=2835
webkit-transform overwrites z-index ordering in Chrome 13
Related
On a webpage i have a google map that should be draggable.
But when dragging the Google Map (is the official web component), Safari drags the whole website (like when dragging an image).
Firefox and Chrome work great (IE not tested).
Any ideas?
MacBook Pro and Safari 7 and 8 where tested.
Would be awesome to hear some ideas.
The drag of the window can be disabled via:
window.ondragstart = function() { return false; }
This solves the issue (although of course the dragging functionality that causes this bug is then disabled)
I have many markers in clusters, one of them with 3 markers in it.
But when I open it, I see only one marker.
If I open developer console in browser or change zoom I see all of them.
What I need to do to prevent it
P.S: I catch this error only in Safari. In Firefox and Chrome everything work fine
This appears to be a CSS problem. No JavaScript code path differences are apparent between Firefox (which works) and Safari (which does not).
In the Cluster.prototype.addMarker() function, removing the "this.markers_[i].setMap(null);" lines, which caused the clusters to remain on the map, though they are cut off as though by a bounding box (see attached screenshot; note that both clusters are cut off at the bottom, at different positions). This leads to believe that the action of hiding the existing markers when creating the cluster icon is causing the cluster itself to be hidden by a misplaced bounding box. This might be the reason for your markers being not displayed at a certain zoom level or zoom action.
This is a problem(bug) with Safari 5.1, you can try with an older version 5.0.5 or the newer version 5.1.1, it should work as expected.
I've disabled dragging on my Google Maps component, here's an example:
http://jsfiddle.net/qr2BJ/7053/
However when I'm browsing on my iPhone I can't swipe down "on" the map. So, when the map is taking up most of the screen, mobile users won't be able to swipe (scroll) down to view the rest of the page.
Is there a way to fix this, apart from sticking an extra empty div on top of Google Maps?
I had the same problem on android devices. As they are running on webkit I guess the cause is the same as for iphone. Anyways, a post on the following link addressed the issue and the first answer worked for me: Embed Google Maps on page without overriding iPhone scroll behavior
If I create a link with the attribute "draggable" and then drag the link, Chrome displays an image of the link that follows the mouse cursor. In some cases, notably when there is distance between the link and the left boundary of its parent node, the dragged image ends up at a constant distance from the mouse cursor.
Why is it that the partially transparent image does not line up with the mouse cursor in Chrome? It seems to work fine in Firefox and Opera. Is this a bug, and is there a fix?
See a very simple example here: http://jsfiddle.net/mjbCN/1/
This was eventually fixed, apparently.
https://code.google.com/p/chromium/issues/detail?id=101204
I'm using google map for my application. When I drag my custom map, Blue and black boxes appear at some places instead of default tiles (gray tiles that are shown when images are not loaded) and they disappear when the map is loaded.
I'm testing on google chrome 18 beta. Here's a screenshot
The effect only apears when dragging and disappears after the map is loaded
I think you should not test in beta versions.if all the latest stable versions work than you are ok.It's their job to take care of these kind of problems.