Skip to content

Leaflet plugin that allows to prevent default map scroll/touch behaviours

License

Notifications You must be signed in to change notification settings

davidfaber/leaflet-gesture-handling

 
 

Repository files navigation

leaflet-gesture-handling.js

A Leaflet plugin that allows to prevent default map scroll/touch behaviours.

For a working example see demo

Ctrl + scroll to zoom the map


Initially based on the work of elmarquis


How to use

  1. include CSS & JavaScript
    <head>
    ...
    <style> html, body, #map { height: 100%; width: 100%; padding: 0; margin: 0; } </style>
    <!-- Leaflet (JS/CSS) -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
    <!-- leaflet-gesture-handling -->
    <link rel="stylesheet" href="https://unpkg.com/@raruto/leaflet-gesture-handling@latest/dist/leaflet-gesture-handling.min.css" type="text/css">
    <script src="https://unpkg.com/@raruto/leaflet-gesture-handling@latest/dist/leaflet-gesture-handling.min.js"></script>
    ...
    </head>
  2. choose the div container used for the slippy map
    <body>
    ...
    <div id="map"></div>
    ...
    </body>
  3. create your first simple “leaflet-gesture-handling” slippy map
    <script>
      ...
      var map = new L.Map('map', {
        center: [41.4583, 12.7059],
        zoom: 5,
        gestureHandling: true,
      });
      ...
    </script>

Compatibile with: [email protected]


Contributors: Elmarquis, Raruto

About

Leaflet plugin that allows to prevent default map scroll/touch behaviours

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 97.8%
  • CSS 2.2%