Leaflet Layer Control，從不同文件中獲取GeoJSON數據

Question

我使用marketClusters創建了一個Leaflet映射，其中GeoJSON數據在一個單獨的js文檔中作為變量進行結構化（並獲取）。 見下面的例子。

var markers = [ { "name":"test", "city":"Stockholm, Sweden", "market":"test", "website":"<a target='_blank' href='http://test.se'>test.se</a>", "lat":5.336391, "lng":1.027678,

我現在要添加的是對我的地圖的圖層控制，我可以根據變量“markers”中的“market”在不同的節點之間切換（它再次位於單獨的文件中）。

作為一個例子，我想為“市場”添加4-5個不同的變量，然后想要在圖層控件中的那些之間切換。

我的代碼基於leaflet.markerCluster插件示例：

 var map = L.map( 'map', { center: [10.0, 5.0], minZoom: 2, zoom: 2 }); L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', { attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>' }).addTo( map ); var myURL = jQuery( 'script[src$="leaf-demo.js"]' ).attr( 'src' ).replace( 'leaf-demo.js', '' ); var myIcon = L.icon({ iconUrl: myURL + '../images/pin24.png', iconRetinaUrl: myURL + '../images/pin48.png', iconSize: [29, 24], iconAnchor: [9, 21], popupAnchor: [0, -14] }); var markerClusters = L.markerClusterGroup(); for ( var i = 0; i < markers.length; ++i ) { var popup = '<b>' + markers[i].name + '</b>' + '<br/>' + markers[i].city + '<br/>' + markers[i].market + '<br/>'+ markers[i].website; var m = L.marker( [markers[i].lat, markers[i].lng], {icon: myIcon} ) .bindPopup( popup ); markerClusters.addLayer( m ); } map.addLayer( markerClusters ); 

我有點迷失如何繼續，任何輸入都非常感謝！

Answer 1

如果你想讓你的標記聚集在一起（混合“橙子和蘋果”），你可能會對Leaflet.FeatureGroup.SubGroup插件感興趣（見演示 ）。 只需為每個market價值創建一個子組，並將其父級設置為markerClusters 。

否則，您只需為每組標記創建1個標記聚類組。 但群集可能會重疊。

免責聲明：我是該插件的作者。