2016-01-22 3 views
0

У меня есть карта листовки, и я использую плагин Leaflet.markerCluster для кластеризации моих маркеров. У меня есть несколько маркеров, которые представляют несколько точек в одном месте. К сожалению, когда он кластеризуется, он представляет только одну точку. Есть ли способ добавить вес к каждому маркеру? Так что кластер видит в нем более одного пункта?Листовка маркера кластера добавить вес в маркер

В основном я надеюсь на clusterWeight собственности, такой как follwing:

var newMarker = L.marker(coordinates, { 
      icon: myIcon, 
      clusterWeight: 5 
     }); 

Это propety не существует, однако. Кто-нибудь знает о работе? Благодаря!

ответ

2

Сначала вам нужно создать маркер, который поддерживает пользовательские свойства. Вы можете сделать это путем расширения по умолчанию L.Marker так:

var weightMarker = L.Marker.extend({ 
    options: { 
     customWeight: 0 
    } 
}); 

Затем вы можете использовать Leaflet.markercluster-х iconCreateFunction для создания пользовательского кластера маркер, изменяя то, что отображается на маркере:

var markers = L.markerClusterGroup({ 
    iconCreateFunction: function(cluster) { 
     // iterate all markers and count 
     var markers = cluster.getAllChildMarkers(); 
     var weight = 0; 
     for (var i = 0; i < markers.length; i++) { 
      if(markers[i].options.hasOwnProperty("customWeight")){ 
      weight += markers[i].options.customWeight;     
      } 
     } 

     var c = ' marker-cluster-'; 
     if (weight < 10) { 
      c += 'small'; 
     } else if (weight < 100) { 
      c += 'medium'; 
     } else { 
      c += 'large'; 
     } 
     // create the icon with the "weight" count, instead of marker count 
     return L.divIcon({ 
      html: '<div><span>' + weight + '</span></div>', 
      className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) 
     }); 
    } 
}); 

Демонстрация: https://jsfiddle.net/chk1/0hq1t13t/

Смежные вопросы