2015-08-24 22 views
0

我正在构建和使用Leaflet和Markercluster的应用程序。到目前为止,我设法在MarkerClusterGroup中获取标记,但它们在地图中出现重复,并且它们中的每一个都位于不同的集群组中(?)。使用Leaflet和Markercluster在每个群集上获取重复的标记。

这是迄今为止代码:

var cluster = new L.MarkerClusterGroup(); 

if (!viewingAllRoutes) { 

    var popupMain = L.popup(
     { 
      closeButton : false, 
      className : 'expat-detail' 
     } 
    ) 
    .setLatLng([latitude, longitude]) 
    .setContent("TEST") 
    .openOn(map); 

    if (finalLocation) { 
     gpstrackerMarker = new L.marker(new L.LatLng(latitude, longitude), {title: title, icon: markerIcon, zIndexOffset: 999}).bindPopup(popupMain).addTo(map); 
    } else { 
     gpstrackerMarker = new L.marker(new L.LatLng(latitude, longitude), {title: title, icon: markerIcon}).bindPopup(popupWindowText).addTo(map); 
    } 
} 

if (viewingAllRoutes) { 

    var popup = L.popup(
     { 
      closeButton : false, 
      className : 'expat' 
     } 
    ) 
    .setLatLng([latitude, longitude]) 
    .setContent(userName) 
    .addTo(cluster); 

    gpstrackerMarker = new L.marker(new L.LatLng(latitude, longitude), {title: title, icon: markerIcon, zIndexOffset: 999}).bindPopup(popup).addTo(cluster); 

    map.addLayer(cluster); 

    gpstrackerMarker.on("click", function() {   
     var url = 'getrouteformap.php?sessionid=' + sessionID; 

     viewingAllRoutes = false; 

     var indexOfRouteInRouteSelectDropdwon = sessionIDArray.indexOf(sessionID) + 1; 
     routeSelect.selectedIndex = indexOfRouteInRouteSelectDropdwon; 

     if (autoRefresh) { 
      restartInterval(); 
     } 

     $.ajax({ 
      url: url, 
      type: 'GET', 
      dataType: 'json', 
      success: function(data) { 
       loadGPSLocations(data); 
      }, 
      error: function (xhr, status, errorThrown) { 
       console.log("status: " + xhr.status); 
       console.log("errorThrown: " + errorThrown); 
      } 
     }); 
    }); // on click 
} 

这是它的样子:

这2组实际上只有2个标记:

enter image description here

然后,当点击它们中的每一个时:

enter image description here

enter image description here

我在想什么?

回答

0

不要将弹出窗口添加到集群层。 它将绑定到标记时已添加到地图。

尝试删除添加它的行并查看它是否有效。

var popup = L.popup(
    { 
     closeButton : false, 
     className : 'expat' 
    } 
) 
.setLatLng([latitude, longitude]) 
.setContent(userName); 
相关问题