How can I make leaflet zoom less with mouse wheel ? If I move my mouse wheel as little as I can, it zooms like 3 levels.
2 Answers
wheelPxPerZoomLevel: 150
is the option that it seems to be affecting the mouse wheel zoom "speed".
// @option wheelPxPerZoomLevel: Number = 50
// How many scroll pixels (as reported by [L.DomEvent.getWheelDelta](#domevent-getwheeldelta))
// mean a change of one full zoom level. Smaller values will make wheel-zooming
// faster (and vice versa).
wheelPxPerZoomLevel: 50
-
If you happen to be using mapbox.js, you'd pass it like this -
const map = L.mapbox.map(mapContainer, null, { wheelPxPerZoomLevel: 150 });
See mapbox.com/mapbox.js/api/v3.1.1/l-mapbox-map Commented Dec 29, 2017 at 19:15
There appears to be an option that is not directly listed on the website documentation but the source has JsDoc lines for it...
this.options.zoomDelta
is where you want to set the amount the zoom is changed by. this
is your current Map
object.
https://github.com/Leaflet/Leaflet/blob/6e8ac319931da744810bef81fffbfc4adbf3a39a/src/map/Map.js#L94 https://github.com/Leaflet/Leaflet/blob/6e8ac319931da744810bef81fffbfc4adbf3a39a/src/map/Map.js#L160
For mouse-wheel zooming, or pinch zooming. Adjusting this.options.zoomSnap
setting will make it snap or settle on levels.
https://github.com/Leaflet/Leaflet/blob/a069c41dd7b1f6a58a47dab26be863c107d18a9f/src/map/Map.js#L95
Looking at the zoom controls, currently holding Shift
and clicking the control zooms in by three times the current value of map.options.zoomDelta
. This does not seem to be true of the mouse operation.
-
Those variables seem to only affect the zoom in/out buttons, not the mouse wheel. Just checked it. Commented May 16, 2016 at 21:12
-
I found the answer, I am posting an answer.
wheelPxPerZoomLevel
is what I need to change. Commented May 16, 2016 at 21:14 -
Sorry about that I read over the mouse wheel part. Sorry on that!– RomaHCommented May 16, 2016 at 21:15
-