Пытаюсь сделать кластеризацию
ymaps.ready(function () {
var map = {};
$('.js-map--trigger').click(function () {
var container = $(this).closest('.item').next('li').find('.js-map');
$('.js-map').css('height', '');
$(container).css('height', '150');
if ('destroy' in map) {
map.destroy();
}
map = new ymaps.Map(container[0], {
center: [55.753915313211486,37.62053621957395],
zoom: 8,
type: 'yandex#map',
flying: true
});
var coordsFromDataAttr = $(this).data('id');
$.getJSON('/items/' + coordsFromDataAttr + '/items', function (data) {
$.each(data, function (key, val) {
map.geoObjects.add(new ymaps.Placemark([val.latitude, val.longitude],{
hintContent: val.address,
balloonContent: '<div><p>' + val.address +'</p><a href="' + val.href + '" class="">Посмотреть</a></div>',
},
{
iconImageHref: 'icon.svg',
iconImageSize: [20, 20],
iconImageOffset: [-10, -20]
}))
})
});
map.controls.add('smallZoomControl', { top: 75, left: 5 });
});
})
Понимаю, что нужно вынести добавление объектов вне функции
getJSON()
и как-то их кластеризировать с собственным стилем, и чтобы при нажатии на кластер происходило приближение к этим меткам.