Дано: с сервера приходит коллекция с геоданными и некоторым числом (допустим sum). Мне нужно вывести все эти точки на карте + кластеризация. Когда точки объеденены в кластер на кластере должно отображаться не количество точек внутри кластера (как по дефолту), а сумма всех значений sum тех точек которые находятся внутри этого кластера (вух надеюсь понятно написал).
Научился кастомизировать шаблон кластера, научился вытаскивать данные и суммировать у каждого конкретного кластера, но вот подружить это дело никак не получается.
Набросал небольшой пример того как я это делаю и снабдил комментами чтобы было понятно мою логику.
ymaps.ready(init);
function init() {
// определяем объект кары
const myMap = new ymaps.Map("map", {
center: [55.90, 36.86],
zoom: 10
});
// определяем шаблон вывода суммы в иконке кластера
const MyIconContentLayout = ymaps.templateLayoutFactory.createClass(
"<span style='color: #000;'>{{ options.orderSum }}</span>"
);
// определяем ObjectManager
const objectManager = new ymaps.ObjectManager({
clusterize: true,
clusterIconContentLayout: MyIconContentLayout
});
// Симуляция ajax запроса
setTimeout(function() {
// данные которые пришли с сервера
data = [{
lat: "55.9062267",
long: "36.8601454",
sum: 500
},
{
lat: "55.907",
long: "36.8601454",
sum: 1000
},
{
lat: "55.9065",
long: "36.8601454",
sum: 1500
},
];
// формируем коллекцию объектов карты
const features = data.map(element => {
return {
type: "Feature",
geometry: {
type: "Point",
coordinates: [element.lat, element.long]
},
data: {
order: element.sum
}
};
});
const collection = {
type: "FeatureCollection",
features
};
// добаляем коллекцию объектов в манагер
objectManager.add(collection);
// добавляем манагер на карту для вывода объектов
myMap.geoObjects.add(objectManager);
// проходимся по всем видимым кластерам, производим суммирование data.order во всех объектах и записываем полученное значение в options кластера
objectManager.clusters.each(cluster => {
let orderSum = 0;
cluster.features.forEach(pin => {
orderSum += parseFloat(pin.data.order);
});
objectManager.clusters.setClusterOptions(cluster.id, {
orderSum
});
});
// тоже самое что и выше только при изменении кластера
objectManager.clusters.events.add("add", event => {
let orderSum = 0;
event.get("child").features.forEach(pin => {
orderSum += parseFloat(pin.data.order);
});
objectManager.clusters.setClusterOptions(
event.get("child").id, {
orderSum
}
);
});
}, 1000);
}
Потыкать в песочнице: https://jsfiddle.net/2w9f58us/17/