如何在当前缩放级别上获取所有可见标记 [英] How to get all visible markers on current zoom level

问题描述

这里有几点:

1. 我在地图上有一些标记，并且在地图旁边的右侧面板上有与之相关的记录.它们通过数字 id 连接，该数字 id 存储为标记的属性.
2. 所有标记都存储在一个数组中.
3. 当用户放大地图时，仅与可见标记关联的记录应显示在右侧面板上.

那么，如何获取当前缩放级别上所有可见标记的列表?我在互联网上搜索过，没有找到有用的东西.可以在此处

So, how to get the list of all visible markers on the current zoom level? I've searched over the internet and didn't find something useful. Some kind of what I'm trying to achieve could be found here

推荐答案

如果还有人需要这个问题的答案，我在 Codepen.io 上有一个完整的工作模型

If anyone is still needing an answer to this question, I have a complete working model on Codepen.io

随意下载并根据您的需要进行调整.只需将 API 密钥更改为您自己的密钥即可.(他们是免费的)

Feel free to download it and tweak it for your needs. Just please change the API key to your own. (They're free)

https://codepen.io/pailwriter/pen/bGEpeRv

这是在视口中获取标记的函数.

Here's the function to get the markers in viewport.

function showVisibleMarkers() {
    var bounds = map.getBounds(),
        count = 0;
                                   
    for (var i = 0; i < markers.length; i++) {
        var marker = markers[i],
            infoPanel = $('.info-' + (i+1) ); // array indexes start at zero, but not our class names :)
                                           
        if(bounds.contains(marker.getPosition())===true) {
            infoPanel.show();
            count++;
        }
        else {
            infoPanel.hide();
        }
    }
    
    $('#infos h2 span').html(count);
}

这篇关于如何在当前缩放级别上获取所有可见标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！