如何在多个标记悬停时显示弹出窗口

我正在显示标记上的弹出窗口,我可以简单地添加以下几行以生成弹出窗口

let marker = L.marker(myloc, { icon: greenIcon }).addTo(map);
marker.bindPopup(map.getCenter() +"<br>" + 
"Min Zoom" + map.getMinZoom() +"<br>" + 
"Max Zoom" + map.getMaxZoom());

我正在努力显示我所在位置附近的标记。我已经使用了leaflet-knn算法。从我的代码中,我将获得5个存储在res中的标记。现在,我必须在悬停或单击事件上显示标记信息。

到目前为止,我已经尝试了以下代码。我出错了。谁能帮助我我做错了什么。

var longitude = myloc.lng,
latitude = myloc.lat;
var map = L.map('map').setView(myloc, 12),
gjLayer = L.geoJson(testCities);


res = leafletKnn(gjLayer).nearest(
[longitude, latitude], 5, distance);

if (res.length) {
    for (i = 0; i < res.length; i++) {
        var popup = res[i].layer.feature.properties.name;

        var m = map.addLayer(res[i].layer).bindPopup(popup);

        if ($.inArray(res[i], oldArr) === -1)
            oldArr.push(res[i]);
    }
}
m.on('mouseover', function(e){
    this.openPopup();
})
SS

您只需对GeoJSON()函数选项进行修改:

var gjLayer = L.geoJson(testCities, {
    onEachFeature: function(feature, layer) {
        content = "<b>Name:</b> " + feature.properties.name;
        layer.bindPopup(content);
    }
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

悬停标记AND弹出时显示地图标记的弹出窗口,悬停时隐藏弹出窗口

如何在悬停时保持动态弹出窗口显示

如何在标记中显示弹出窗口?

在悬停而不是单击时显示弹出窗口

在<div>悬停时,如何找到关联的Mapbox标记,更改其颜色并打开弹出窗口?

悬停时地图框标记的弹出窗口不起作用

单击时显示/隐藏多个弹出窗口

Flutter - 当有多个弹出窗口时如何使弹出窗口消失?

悬停在图像上时如何在图像旁边创建 HTML 弹出窗口?

如何在悬停时更改模态弹出窗口的字体大小

如何在鼠标悬停时在react-leaflet中切换弹出窗口

如何在“小叶”中将鼠标悬停而不是单击时打开弹出窗口

谷歌地图反应-reactjs:如何在单击标记后动态显示弹出窗口

如何在弹出窗口中显示消息?

如何在ViewController中显示弹出窗口

悬停时如何保持Bootstrap弹出窗口的生命?

在鼠标悬停时显示弹出窗口,在鼠标悬停时将其关闭

如何防止传单上的标记上的点击显示弹出窗口?

如何在点击时打开弹出窗口?

在悬停(ngx-bootstrap)的弹出窗口时,如何保持弹出窗口的生命?

在网页上提交表单时,如何在上传文件时显示弹出窗口?

如何在swing Java的弹出窗口中显示多个jpassword字段?

如何在同一个弹出窗口中显示多个不同的 div?

如何在R的传单地图中的弹出窗口上显示多个文本

仅当未显示弹出窗口时,才在悬停时显示传单工具提示

如何在不破坏“流”显示的情况下在Poplet FlowMap中添加弹出窗口或将弹出窗口绑定到点/标记?

如何在标记中在鼠标悬停时显示名称:Google Map API

如何显示弹出窗口

如何显示弹出窗口