問題描述

這有點(diǎn)類似于這里提出的問題--

我正在為地圖應(yīng)用程序編寫一個(gè)搜索框，該應(yīng)用程序從服務(wù)器一次檢索一整套搜索結(jié)果(人名和信息)，然后翻閱結(jié)果列表.因此，在地圖上的任何給定點(diǎn)，都有兩種標(biāo)記 - 背景標(biāo)記用于在搜索結(jié)果中但不在當(dāng)前頁面中的點(diǎn)，以及用于在當(dāng)前搜索結(jié)果頁面中的點(diǎn)的前景標(biāo)記.

I'm writing a search box for a map application, which retrieves a whole set of search results (people's names & info) at once from a server and then pages through the list of results. So at any given point on the map there are two kinds of markers -- a background marker for points which are in the search results but not in the current page, and a foreground marker for points which are in the current page of search results.

所有這一切都很好.我現(xiàn)在想做的是設(shè)置它，以便如果用戶縮放或平移地圖，搜索結(jié)果列表會(huì)更新以僅顯示當(dāng)前地圖范圍內(nèi)的標(biāo)記.

All this works nicely.. what I'd like to do now is set it up so that if a user zooms or pans the map, the search results list updates to show only markers within the current map bounds.

顯然有服務(wù)器端的方法可以做到這一點(diǎn)，或者我也可以遍歷整個(gè)標(biāo)記列表，看看哪些符合當(dāng)前范圍；但是有人知道在傳單中執(zhí)行此操作的內(nèi)置方法嗎?看起來像 map.getVisibleLayers() 的東西?

Obviously there are server-side ways to do this, or I could also just run through the whole list of markers to see which fit within the current bounds; but does anybody know a built-in way to do this within leaflet? Something which would look like map.getVisibleLayers()?

推薦答案

我認(rèn)為這可能會(huì)有所幫助:https://github.com/stefanocudini/leaflet-list-markers

I think this may be of help: https://github.com/stefanocudini/leaflet-list-markers

從演示中可以看出，包括圖層中的所有標(biāo)記，此插件僅顯示當(dāng)前視口中可見的標(biāo)記列表.它的用法很簡(jiǎn)單，連續(xù):

as you can see from the demo, including all markers in a layer, this plugin shows a list of only those visible in the current viewport. Its usage is simple, in a row:

var markersLayer = new L.LayerGroup();
map.addControl( new L.Control.ListMarkers({layer: markersLayer}) );

獲取代碼如下:

var layers = L.LayerGroup(), //layers contains all markers..
    contained = [];          //makers in map boundingbox

layers.eachLayer(function(l) {
    if( l instanceof L.Marker && map.getBounds().contains(l.getLatLng()) )
        contained.push(l);
});

這篇關(guān)于在 Leaflet 中獲取當(dāng)前地圖范圍內(nèi)的標(biāo)記/圖層列表的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！