Google Maps API: mouse wheel zoom breaks on Chrome if scrolled quickly - google-maps

I've encountered this with Chrome on maps using the Javascript API. I don't see this bug (a) on the regular Google Maps page or (b) using Safari.
I can replicate this on Google's basic demo page:
https://developers.google.com/maps/documentation/javascript/examples/map-simple
The problem occurs whenever I spin the mouse wheel quickly. At that point, the mouse wheel zoom stops working (mostly).
Zooming by clicking on the +/- buttons still works fine.
On the demo page above, if you spin the mouse wheel without holding the alt or ⌘ key, it will show a message like "Use ⌘ + scroll to zoom the map". This still appears, so the map doesn't appear to be losing the mouse wheel event itself. (The problem is not limited to maps that require holding down a key, though.)
The mouse wheel zoom also doesn't stop working entirely, it just looks like it's dropping 90% (or more) of the events. If I spin the mouse wheel quickly, the map will usually respond (but will zoom an unpredictable number of levels). If I spin the wheel one tick at a time, eventually one of the ticks will trigger a zoom.
No error or diagnostic messages appear in the console.

Related

Preloading ArcGISDynamicMapServiceLayer on pan

When I pan the map with the mouse, I want the visible layers to update (before I release the mouse). Ideally, it would actually be preloaded, like the basemaps, so that you don't have to see the unloaded edge of the layers.
Example: Say I have a layer which is a solid red block over the entire map. When I pan, the screen moves so that you see that the red layer doesn't extend to infinity; it's actually covering only the viewport. It now appears as a rectangle which is moving around the screen as you pan, until you release. I want the user to be able to pan and only ever see red. This is a contrived example, but it's the functionality I want.
What doesn't work: I have already tried running a layer.refresh() command on the map's pan event. That won't work until after you release the mouse.
Well, As I am understanding above requirement. you want to add a layer on the ESRI map; which will refresh every time you pan or zoom.
In this case no need to add the layer as ArcGISDynamicMapServiceLayer. Simply add the layer as a feature layer in ondemand mode.
To know about feature layer and its mode please click here...
As we know it request to update layer automatically whenever you change extent of the map.
Hoping I gave you the hint which you are looking for... :)

Switching to StreetView

I have one problem (first entered as a comment, Aug 2014). The first time I drag pegman onto the map (having moved it using GeoCode away from the default centre), it shows streetview at the default centre (GMMap.RequiredProp.Center.Lat/Lng). Doing it a second time works fine. When I drag pegman, I can very quickly see the correct streetview, then this is overlaid with the wrong one.
My guess is that the streetview layer exists when the program starts, but is not visible. Dragging pegman makes it visible, which then provides the opportunity to close the layer. Dragging pegman a second time creates the layer at the correct position, then makes it visible.
I notice that MegaDemo does the same thing, showing Gaudi's cathedral when the pegman is first dragged onto the map somewhere else.
How do I show the correct position first time?
Regards,
Dan
i had the same problem and i probably found solution. It is in DoMap script in map.html which is contained in gmmapres.res.
Sinner is line
panorama.setPosition(new google.maps.LatLng(Lat,Lng));
when i commented it and recompiled resource (rc.cmd) and then GMLib, Streetview started to work correctly.

Marker clusterer bug when dragging the map? (Many markers on google maps)

I got the many markers solution on my website.
I noticed though that when I drag the map there seams to be an issue if I start dragging the map when holding the mouse over a many-markers icon.
The map zooms in on the position when I release the mouse button. This feature is suppose to be there when I click an icon.. but should´nt be there when I´m trying to drag the map?
It even looks like googles (own?) example has this issue so it might not be my code.
http://gmaps-samples-v3.googlecode.com/svn/trunk/toomanymarkers/toomanymarkers.html
Open the link
Check the "Many markers" box
Try to drag the map when the mouse is over a "many marker" icon.
Frustrating when the map zooms in when I try to scroll the map sideways.
google.maps.event.addListener(map,'dragstart',function(){
mc.zoomOnClick_=false;});
google.maps.event.addListener(map,'mouseup',function(){setTimeout(function(){
mc.zoomOnClick_=true;},50);});
These lines(mc is the MarkerClusterer-Instance) should help.
It disables the zoomOnClick-feature when you start dragging the map and re-enables it on mouseup(with a short delay, because mouseup fires before click)
I think this is a side effect of the intended functionality. The library will be detecting the mouseup event and zooming on the marker that was selected by mousedown I imagine.
I suppose the two options that you have are to either disable the zoom on click functionality entirely, or to alter the library yourself (possibly branch it if you think others will use it) to perhaps zoom on a different event, e.g. mousedown.
The answer from #Dr.Molle will work as long as sources are not minified (mangled names). I had to upgrade to MarkerClustererPlus which provides a method for changing zoom on click. MarkerClustererPlus ist mostly backwards compatible to MarkerClusterer.
google.maps.event.addListener(map, 'dragstart', function() {
mc.setZoomOnClick(false);
});
google.maps.event.addListener(map,'mouseup',function() {
setTimeout(function() {
mc.setZoomOnClick(true);
}, 50);
});

Google Maps Window only showing part of the map

I have used Google Maps on many websites in the past, but I have been posed with an issue I haven't experienced before. The maps window is showing, but it's only showing maps segments from the top left, and anything after that (even when i'm navigating around), nothing loads to the right. Its as if the window that is navigated around has an internal offset that is pushing it off the side of the viewport. Does anyone know what could be causing it?
EDIT
I have just discovered that when the window is resized, the map refreshes, and the layout is fixed.
The map is contained within a tab that is shown via javascript (and hidden via display:none). The tab container is loaded via ajax, and when it loads, the loadMap function is called. I tried postponing the loadMap function by enclosing it within a setTimeout function that delays the creation of the map by 1 second, but it still does the same (requiring the window to be resized to fix it)
This is a typical problem you'll run into when the map container is hidden or has zero dimensions at the time you create the map.
The usual solution is to do one of these:
Defer creating the map until the container element is visible and sized properly, or
Call google.maps.event.trigger( map, 'resize' ) after the map becomes visible or is resized. This event tells the Maps API to readjust its calculations of what's visible in the map.
It sounds like you've already solved it by using the first option, which is definitely the better choice of the two. Your page will load faster because you aren't spending the time to create an invisible map. If you do have a situation where the map size may change (e.g. a resizable window) then you can trigger the resize event when that happens.
Righto, I am not sure why it's not working, but I have changed my code to only execute the map creation function when the tab is first opened. That makes it work correctly

Freeze Google Map until user clicks

I'm fairly new to Google Maps API, so spare the flame :)
How do I disable the controls of a google map(i.e. scroll, drag etc.) untill a user clicks on the map itself? I want the user to be able to scroll down on a page without ending up scrolling on the map. Due to design decisions the map appears in a position often hit by a scrolling user.
I don't want to use a static map, since I still want the user to be able to use the map, when he feels the need to do so.
Any ideas?
The map has methods to enable and disable dragging. You could just create the map with dragging disabled, and call enableDragging() whenever you want.
Add a mouse click listener to the map div, which calls enableScrollWheelZoom. You could also destroy the listener after it's called the first time.
jQuery example:
$("#mapDiv").click(function() {
map.enableScrollWheelZoom();
});
The API reference indicates that scroll wheel zoom is disabled by default - if it's enabled because of any other calls you've made (such as setUIToDefault), just disable it first.