Добрый день!
Делаю карту с кластеризатором.
Иконка кластера должна менять цвет (типа тепловой карты) в зависимости от одного из свойств входящих в него меток ('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. Как задать иконкам область клика
Заранее спасибо