将鼠标悬停在GeoJson层上的圆圈上后，弹出窗口

Make popup appear after hovering overing circle on GeoJson layer

本文关键字：窗口 悬停 鼠标 GeoJson      更新时间：2023-09-26

我正在使用一个外部GeoJson文件（数据）来用点填充地图。我想做的是将鼠标悬停在一个显示弹出窗口的圆圈上，然后跟随鼠标。我还想为任何不使用鼠标的人提供一个点击选项。我尝试了不同的步骤，但都不适用于我下面的步骤：

//BUILD MAP
var layer = new L.StamenTileLayer("toner-lite");
var map = new L.Map("map", {
    center: new L.LatLng(28.100, -83.600),
    zoom: 6
});
map.addLayer(layer);
//Load GeoJson
L.geoJson (data, {
    onEachFeature: function (feature, layer) {
        layer.bindPopup(feature.properties.description + " " + feature.properties.name);    
    },
    pointToLayer: function(feature, latlng) {
        return new L.CircleMarker(latlng, {
        radius: 8,
        fillColor: "red",
        color: "#000",
        weight: 2,
        fillOpacity: 0.6,
        });
    }
}).addTo(map);
var circle = L.circleMarker([28.100, -83.600], 5000).addTo(map);
circle.setStyle({
        color: 'red',
        fillColor: 'red',
        fillOpacity: 0.5,
});

试试这个：

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