Popup bei Mouse-Over anzeigen, nicht bei Klick mit Leaflet?

Ist es im Leaflet möglich, dass ein Popup beim Mouse-Over und nicht beim Klicken geöffnet wird?

Dies funktioniert jeweils nur für einen Marker, aber ich benötige es für eine größere Anzahl von Markern:

marker.on('mouseover', function(e){
    marker.openPopup();
});

Wenn Sie das Popup für einen Marker anzeigen müssen, können Sie die bindPopup-Methode für Marker verwenden.

Dann haben Sie mehr Kontrolle und es wird automatisch an Ihren Marker gebunden.

Im folgenden Beispiel können Sie das Popup-Fenster anzeigen, wenn der Benutzer mit der Maus darüber fährt, und ausblenden, wenn der Benutzer mit der Maus darüber fährt:

        marker.bindPopup("Popup content");
        marker.on('mouseover', function (e) {
            this.openPopup();
        });
        marker.on('mouseout', function (e) {
            this.closePopup();
        });

Hinweis: Möglicherweise treten Probleme beim Schließen der Popups auf, wenn Sie mit der Maus auf das Popup selbst fahren. Daher müssen Sie möglicherweise den Popup-Anker anpassen (siehe Popup-Einstellungen), damit Ihre Popups etwas weiter vom Marker selbst entfernt angezeigt werden zu leicht verschwinden.

Dies wird dazu beitragen, Pop-up auf Marker Mouseover anzuzeigen

marker.on('mouseover', function(e) {
  //open popup;
  var popup = L.popup()
   .setLatLng(e.latlng) 
   .setContent('Popup')
   .openOn(map);
});

Dies ist kein Flugblatt-spezifisches Problem, sondern eine Frage von Javascript.

Speichern Sie Ihre Markierungen in einer Sammlung und binden Sie openPopupsie dann 'mouseover'für alle an ein Ereignis.

Zum Beispiel mit einem Array:

var markers = getAllMarkers(); // up to you to implement, say it returns an Array<L.Marker>

for (var i = 0; i < markers.length; i++) {
    var currentMarker = markers[i];
    currentMarker.on('mouseover', currentMarker.openPopup.bind(currentMarker));
}

Wenn Sie Leaflet 1.3.x verwenden, ist die Tooltip-Bindung eine integrierte Methode.

http://leafletjs.com/reference-1.3.0.html#tooltip

var polyline = L.polyline([[StartLat, StartLong],[EndLat,EndLong]]).addTo(this.map);
    polyline.bindTooltip("tool tip is bound");

In Bezug auf eine Lösung, die "für eine größere Anzahl von Markern" funktioniert, ist dies das, was ich für jede Ebene von Punktdaten mache, die von GeoJSON geladen werden:

var layerPopup;
featureLayer.on('mouseover', function(e){
    var coordinates = e.layer.feature.geometry.coordinates;
    var swapped_coordinates = [coordinates[1], coordinates[0]];  //Swap Lat and Lng
    if (map) {
       layerPopup = L.popup()
           .setLatLng(swapped_coordinates)
           .setContent('Popup for feature #'+e.layer.feature.properties.id)
            .openOn(map);
    }
});
featureLayer.on('mouseout', function (e) {
    if (layerPopup && map) {
        map.closePopup(layerPopup);
        layerPopup = null;
    }
});