We need to implement a zoom-protection for (not full-size) maps on webpages while scrolling. Without this protection, currently the users get annoyed when navigating on webpages with small maps. Instead of scrolling down a page, they end up zooming into the map. It's more than understandable that this is annoying especially on webpages where the scrollale frame around the webmap is rather small.
Almost the desired behaviour is demonstrated in this (Google Maps based) application: https://www.strittmatter-partner.ch/unternehmen/standorte
We found this sample code: https://totalapis.github.io/sample-code/view-disable-scroll-zoom/index.html
What we're missing in this sample code is:
1. the same zoom-protection for the mobile map. Currently, if this sample code is opened on a mobile device, the map can be scrolled using the usual swipe gesture. Since the swiping is the mobile equivalent of scrolling, we would expect (and want) it to work there similarly. is this possible? and how?
2. an informative message displayed on the map on how to enable/activate the zoom by scrolling/swiping functionality. Ideally, we'd like to activate the full functionality of the map by clicking (for desktop)/tapping (for mobile) the map. Is this possible? And how?
Alternatively, we could imagine to use the "google-solution" with Ctrl+scrolling (desktop) / swiping with two fingers (mobile) for maps which are not full size.
thank you in advance!
Is something like this what you're looking for?
https://developers.arcgis.com/javascript/latest/sample-code/view-disable-zoom/
StoryMaps uses this.
Thank you for sharing this sample code. It's not quite what I was looking for in the desktop version, but it is for the mobile version! 🙂