Comment personnaliser l'interaction tactile sur les cartes dépliant

Comment personnaliser les cartes de brochure pour désactiver défilement un doigt sur les appareils mobiles et ajouter deux défilement des doigts comme google maps (voir https://developers.google.com/maps/documentation/javascript/interaction)Comment personnaliser l'interaction tactile sur les cartes dépliant

Je pense que quelque chose comme un auditeur sur le doigt vers le bas et le doigt vers le haut et une superposition personnalisée ou sth. comme ça devrait aider. Mais comment intégrer correctement ceci comme un plugin dans la brochure?

<html> 
 
    <head> 
 
    <link href="https://unpkg.com/[email protected]/dist/leaflet.css" rel="stylesheet"/> 
 
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script> 
 
    </head> 
 
    <body> 
 
    <div id="mapid" style="width: 600px; height: 400px;"></div> 
 
    <script> 
 
     var mymap = L.map('mapid', {center: [48,9], zoom:8, layers: [L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png')]}); 
 
    </script> 
 
    </body> 
 
</html>

Source

2017-01-12 Patrick

carte échantillon ajouté. Comportement normal: Mappez le mouvement si le toucher commence dans la zone de carte. Je recherche une solution pour ne faire défiler que la carte, si deux doigts sont utilisés (e.originalEvent.touches.length == 2), sinon la page devrait être défilée. – Patrick

BTW il y a une [demande de fonctionnalité pour cela dans la UserVoice de Dépliant] (https://leaflet.uservoice.com/forums/150880-ideas-and-suggestions-for-leaflet/suggestions/17510338-a-gesturehandling-option-to -l-carte). – totymedli

mis simplement le dragging option of your map à false, mais assurez-vous de garder le touchZoom option comme true. Cela désactivera le glissement d'un doigt, tout en permettant à l'utilisateur d'effectuer un zoom pincé avec deux doigts, ce qui permet également de faire un panoramique sur la carte.

Si vous voulez que ce comportement que dans les appareils mobiles, utilisez L.Browser.mobile pour définir la valeur de l'option dragging, comme dans

var map = L.map('map', { dragging: !L.Browser.mobile });

Source

2017-01-13 09:34:34 IvanSanchez

Merci, mais j'ai besoin d'une solution pour permettre de faire glisser la carte et la page (comme décrit dans le lien ci-dessus). La carte doit également être déplacée, mais si la carte couvre la plus grande partie de l'écran sur les appareils mobiles, il est impossible de faire défiler la page vers le haut. – Patrick

Alors dites-vous que vous avez essayé cela et que ça ne marche pas? – IvanSanchez

Shure, avec cette option, il est possible de faire glisser la page mais il n'est plus possible de faire glisser la carte avec un, deux ou plusieurs doigts. En outre, zoomer sur la carte n'est plus vraiment possible car la page défile aussi avec deux doigts. – Patrick

Comment personnaliser l'interaction tactile sur les cartes dépliant

Répondre

Questions connexes