Leaflet: Tippen auf Marker in iOS/Ionic/Cordova/Phonegap öffnet kein Popup

Welche Leaflet-Version verwenden Sie? Haben Sie versucht, ob es auf Leaflet-Master funktioniert? Funktioniert es nicht auch bei offiziellen Leaflet-Beispielen?

Die gleiche Art von Fehler (klingt so) wurde gerade von jemand anderem auf Stackoverflow gemeldet:

Ich verwende eine Broschürenkarte über mapbox.js in einer Hybridplattform, die mit dem Ionic-Framework entwickelt wurde. Bisher funktioniert alles gut, außer auf einen Marker in iOS zu klicken. Auf allen anderen Plattformen (Chrome, Webapp auf Android, Androidapp) genügt ein Tippen auf den Marker, um das Click-Event auszulösen. Unter iOS muss ich immer zweimal auf die Markierung tippen, bevor das Ereignis ausgelöst wird. Das Problem ist das gleiche, egal ob ich die App als Webapp in Safari oder als Standalone-App über Cordova verwende. Irgendwelche Ideen, was ich tun kann, um das gleiche Verhalten auf iOS wie auf anderen Plattformen zu erreichen?

http://stackoverflow.com/questions/28955508/ios-ionic-leaflet

Hey, ich bin der Typ von der Stackoverflow-Ausgabe. Ich glaube, mein Problem ist irgendwie anders. Es scheint, als ob das erste Tippen auf die Karte verloren geht, während ein zweites Tippen das Klickereignis/Popup auslöst. Ich habe gerade entdeckt, dass nur das erste Tippen nach dem erneuten Rendern der Karte verloren geht. Nach einer ersten Interaktion mit der Karte genügt ein Fingertipp, um das Ereignis auszulösen.

Auch dieses Problem - erhalten Sie einen UNSPECIFIED_EVENT_TYPE_ERR: DOM Events Exception 0
Als ob sich das Ereignis zum Starten des Popups nicht registriert? Auf iOS, nicht auf Android getestet

Ereignisse werden auch nicht in den standardmäßigen Zoom-In/Out-Steuerelementen registriert. der Pinch-Zoom auf der Karte funktioniert jedoch

Habe das erwähnte Problem mit zwei tap hat keine Auswirkung. Die App verwendet fastclick.

Ich habe auch das Problem mit zwei Tippen, das @iH8 und @evenfrost sehen. Jedes Mal, wenn etwas außerhalb der Karte berührt wird, bedarf es eines Tippens, um sich wieder auf die Karte zu "fokussieren", bevor die Ereignisse durchkommen.

Ich bin mir nicht sicher, ob es sich um dasselbe Problem handelt, aber wenn ich Leaflet mit jQuery Mobile unter iOS verwende, habe ich Probleme, ein Popup durch Tippen auf einen CircleMarker zu öffnen. Es öffnet sich schließlich, aber es kann ein Dutzend Fingertipps dauern, bis es funktioniert. Kein ähnliches Problem auf Android.

Ich habe das gleiche Problem wie @asherwebb .
Wenn ich Broschürenbeispiele in Safari auf iOS öffne, funktioniert das Klicken auf Ereignisse auf Markierungen und die Karte.
Aber wenn ich die .js in meiner Cordova-App implementiere, werden die Ereignisse nicht ausgelöst und ich erhalte die folgende Fehlermeldung:
[Fehler] UNSPECIFIED_EVENT_TYPE_ERR: DOM-Ereignisse Ausnahme 0: Der Typ des Ereignisses wurde beim Initialisieren des Ereignisses nicht angegeben, bevor die Methode aufgerufen wurde.

Funktioniert gut auf Android...

Das gleiche Verhalten hier, seltsamerweise funktioniert das Ziehen, sodass die Erfassung eines Klicks funktionieren sollte.
@Blechfalke für mich funktioniert nicht auf Android welche Android-Version und welches Gerät verwendest du?

Es scheint mir, dass onClick nie ausgehen wird.
Ich benutze mousedown und das funktioniert für mich auf dem 1.0-dev ich habe das Problem verfolgt:
L.Map.Tap auf die Methode _onDown setzt in Zeile 7736:

    this._holdTimeout = setTimeout(L.bind(function () {
        if (this._isTapValid()) {
            this._fireClick = false;
            this._onUp();
            this._simulateEvent('contextmenu', first);
        }
    }, this), 1000);

Dass this._fireClick = false immer (zumindest bei meinen Tests) vor dem _onUp aufgerufen wird.
_onUp prüft es als:

if (this._fireClick && e && e.changedTouches) {

        var first = e.changedTouches[0],
            el = first.target;

        if (el && el.tagName && el.tagName.toLowerCase() === 'a') {
            L.DomUtil.removeClass(el, 'leaflet-active');
        }

        this._simulateEvent('mouseup', first);

        // simulate click if the touch didn't move too much
        if (this._isTapValid()) {
            this._simulateEvent('click', first);
        }
    }

Da this._fireClick false war, wurde this._simulateEvent('click', first); wurde nie angerufen.
Ich habe nicht genug Informationen über die Broschüre, um zu wissen, was dies verhindert und warum oder wann _fireClick falsch sein sollte, aber da mousedown immer auf _onDown gefeuert wurde, war dies ein ausreichender Ersatz für onclick

@drFabio Ich verwende ein HTC One M7 mit Android 5.0.3
seltsamerweise scheinen keine Events auf iOS zu funktionieren, weder das 'Click', noch das 'Touchend'

Passiert dies also nur mit 0.7.3 oder auch mit 1.0-dev (Master-Zweig)?

Ich habe das gleiche Verhalten auf 1.0-dev

Da ich Hammer.js in meinem Projekt verwende, ist es erwähnenswert, dass ich dieses Problem mit dem Ereignis tap umgehen konnte.

Schade. :( Jede weitere Hilfe zu diesem Problem ist willkommen.

Dies ist die schreckliche Kluge, die ich verwendet habe, um das Öffnen der Popups zu ermöglichen, ohne mehrmals klicken zu müssen:

    map.on('click', function (evt) {
        var latLng = evt.latlng,
            clickedPoint = evt.layerPoint,
            nearestMarker = null,
            minDistance = Infinity,
            markerClickDistance = 12, // pixels
            distance;
        markersLayer.eachLayer(function (circleMarker) {
            distance = latLng.distanceTo(circleMarker.getLatLng());
            if (distance < minDistance) {
                minDistance = distance;
                nearestMarker = circleMarker;
            }
        });
        if (nearestMarker) {
            distance = map.latLngToLayerPoint(nearestMarker.getLatLng()).distanceTo(clickedPoint);
            if (distance <= markerClickDistance) {
                nearestMarker.openPopup();
            }
        }
        return false;
    });

Hallo Leute,

Ich möchte nur wissen lassen, dass ich dieses Problem auch in Version 0.7.3 hatte. Das Setzen von options.tap auf false es für mich behoben.

Hey, ich habe auch den Tab ausprobiert: false, den @ovanschie erwähnt hat und es hat funktioniert.

+1. Ich habe das gegenteilige Problem, bei dem der Geräteklick in Ordnung ist, der Browser jedoch eine Lösung benötigt, die der Lösung ähnelt, die ein contextmenu Ereignis erstellt und den Handler daran übergibt: https://github.com/Leaflet/ Merkblatt/Ausgaben/3184#issuecomment -117276381

Dies (Touch auf Marker funktioniert nicht) ist immer noch ein Problem. Versuchte verschiedene Leaflet-Versionen, über Hacks, ohne Erfolg. Android, mehrere Versionen (einschließlich Marshmallow)/Geräte/Browser. Es macht mein Webtool auf Mobilgeräten meistens unbrauchbar. Bitte so schnell wie möglich beheben!

+1 ist ab Commit 99a48a5 (vor 2 Tagen) immer noch nicht behoben. Ich habe einige Ereignisprotokolle in #3929 gepostet, die mir seltsam erscheinen.

Mit der Leaflet-Version behebt die 0.7.7 Kartenoption dragging: false das Problem, also möglicherweise ein Problem irgendwo in L.Draggable .
In L.Draggable _onDown L.DomEvent.stopPropagation(e);
Das Auskommentieren dieses stopPropagation behebt das Problem, Marker sind wie erwartet anklickbar.
Ich verstehe die Funktion nicht gut genug, um zu wissen, ob dies hilfreich ist.

Seltsamerweise funktionieren die Marker anfangs mit Ionic beim Einrichten der Karte und Details alle direkt von einem Controller. Sobald die Modelle von einer $http-Antwort zum Auffüllen der Karte übergeben werden, erscheinen die Markierungen alle wie erwartet auf der Karte, sind aber nicht mehr anklickbar (nach einem clearLayers ).

Eine Karte mit { dragging :false } auf 0.7.7 behebt das Problem für mich nicht. Android 6.0, Chrome.

Mein Problem beim Deaktivieren von Framework7 _feature_ gelöst, die die Ereignisse durcheinander bringen. Mehr Infos .

Schließung zugunsten der Problemumgehung von

Bei meinem ionischen Projekt hat mir das geholfen / behoben: https://github.com/driftyco/ionic/issues/4506#issuecomment -151654171

Ich hatte auch dieses Problem und habe es gelöst, indem ich das Attribut data-tap-disabled="true" zu dem Element hinzugefügt habe, das die div der Karte enthält