Freeze Google Map until user clicks.

Question

Hi, 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?

Answer 1

The map has methods to enable and disable dragging. You could just create the map with dragging disabled, and call enableDragging() whenever you want.

Answer 2

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.