How to disable two-finger website scrolling when using Leaflet map?

Viewed 553

On my demo website I am using a Leaflet map on which I have disabled one finger panning to improve user experience on mobile platforms.

var map = L.map('myMap', {
    dragging: !L.Browser.mobile,
    tap: !L.Browser.mobile
}

This works fine, the website visitor can scroll past the map without troubles.

The problems start when the user wants to pan the map using two fingers. Such moves also scroll the website making the map effectively unusable.

Is there any way to prevent the user to scroll the website while panning the map using two fingers?

1 Answers

touchZoom:!L.Browser.mobile probably fits your needs.

https://leafletjs.com/reference-1.7.1.html explains touchZoom :

Boolean|String : Whether the map can be zoomed by touch-dragging with two fingers. If passed 'center', it will zoom to the center of the view regardless of where the touch events (fingers) were. Enabled for touch-capable web browsers except for old Androids.

Related