Google Maps API v3 won't disable scroll wheel after map loads
google-maps-api-3, javascript
Solution
Editing undocumented properties on Maps API objects is not supported and can lead to unpredictable results. You shouldn't directly modify properties on a map object. Instead, modify the properties using one of the documented options:
Object specific defined getters/setters:
map.setOptions({'scrollwheel': false});
MVCObject generic getters/setters:
map.set('scrollwheel', false);
var isScrollWheelEnabled = map.get('scrollwheel');
Both of these options successfully disabled scrollwheel zooming of the map after it had already been initialized.
Problem
I'm implementing google maps on a website and everything is working great, except that I can't seem to be able to disable the scrollwheel after the maps has loaded. If I set the option before the map loads to scrollwheel: false, then the scroll wheel is disabled, but if I try and do it later (I have a checkbox that enables/disables the scroll wheel). Here are my options for the google map on page load: ``` var myOptions = { zoom: 15, center: currentPosition, draggable: true, scrollwheel: true, mapTypeId: google.maps.MapTypeId.ROADMAP }; ``` map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); and then after the click event has trigger on the checkbox, I have the following code to disable the scrollwheel. funny enough, the draggable = false is working and prevents me from dragging the map. ``` var checked = $('#chkPin').is(':checked'); log("map active: " + checked); if (checked) { map.scrollwheel = false; map.draggable = false; map.zoomControl = false; } else { map.scrollwheel = true; map.draggable = true; map.zoomControl = true; } ```