Добрый день!
Делаю карту с кластеризатором.
Иконка кластера должна менять цвет (типа тепловой карты) в зависимости от одного из свойств входящих в него меток ('total')
То есть после того, как клстеры пересчитались, необходимо посчитать сумму total у входящих в каждый кластер меток, а затем, пробежаться по всем кластерам и найти min и max. После этого сам кластер будет иметь цвет от зеленого до красного.
есть функция recalcClusters которая все это выполняет:
_recalcClusters = function () {
var clusters = clusterer.getClusters(),
min = 100000000,
max = 0,
clusterProps = [],
i;
for (i = 0; i < clusters.length; i++) {
var total = 0,
geoObjects = clusters[i].getGeoObjects();
for (var j = 0; j < geoObjects.length; j++) {
total += parseInt(geoObjects[j].properties.get('total', 0));
}
clusterProps[i] = total;
min = Math.min(min, total);
max = Math.max(max, total);
}
var clusterNums = clusterer.options.get('clusterNumbers'),
props = {};
for (i = 0; i < clusters.length; i++) {
if (clusterProps[i] > clusterNums[1]) {
props['className'] = 'big';
} else if (clusterProps[i] > clusterNums[0]) {
props['className'] = 'medium';
} else {
props['className'] = 'small';
}
clusterColor = '#'
+ ("00" + Math.floor(255 * (clusterProps[i] -min ) / (max - min) ).toString(16)).substr(-2)
+ ("00" + Math.floor(255 * (1 - ((clusterProps[i] - min) / (max - min) ))).toString(16)).substr(-2)
+ '00';
props['hintContent'] = clusterProps[i];
props['total'] = clusterProps[i];
props['color'] = clusterColor;
clusters[i].properties.set(props);
}
},есть макет кластера и ccs для разных размеров:
clusterIconLayout: ymaps.templateLayoutFactory.createClass(
'<div class="cluster {{ properties.className }}"><div style="background-color:{{ properties.color }}">' +
'{{ properties.total }}</div></div>'
),Прошу помощь клуба:
1. На какое событие повесить такой обработчик
2. Как задать иконкам область клика
Заранее спасибо