Как открыть балун кластера

Пост в архиве.

divined

26 октября 2014, 17:08

В этом вопросе скрывается целых три:

1. Собственно как открыть?

http://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/objectManager.ClusterCollection.xml - тут есть пример

Пример: // Откроем балун кластера с нужным выбранным объектом. var objectState = objectManager.getObjectState(myObjects[i]); if (objectState.isClustered) { objectManager.clusters.state.set('activeObject', myObjects[i]); objectManager.clusters.balloon.open(objectState.cluster.id); }

Однако:

TypeError: objectManager.clusters.balloon is undefined - objectManager.clusters.balloon.open(objectId);

2. Как узнавать когда открывать балун, а когда нет и позволить изменить масштаб карты.

3. Как загружать результат? Т.е. у нас есть набор объектов внутри кластера, и если нам нужно вывести (например аккордеон), то нам нужно загрузить балуны для всех объектов внутри и затем открыть балун кластера? Или загрузить уже готовый бален для кластера?

3 комментария

Авторизуйтесь, чтобы оставить комментарий

mari-na-bzzz

27 января 2016, 23:33

1. У нас есть рабочий пример в песочнице - http://api.yandex.ru/maps/jsbox/2.1/object_manager_balloon

Посмотрим, что там за беда с примером в документации

2. Что вы имеете в виду? Встроенная логика такая - ловим клик на кластере, смотрим, какой у карты максимальный зум, если можно еще зазумиться, то зумимся - иначе открываем балун. Вы хотите это же реализовать или что-то свое сделать?

3. В песочнице есть пример как подгружать данные по требованию для метки. Для кластера все аналогично - нужно только загрузить данные для меток в составе кластера и записать данные в кластер и метки http://api.yandex.ru/maps/jsbox/2.1/object_manager_balloon_async

Марина Дьякова

27 января 2016, 23:33

Поясните, пожалуйста, по 3му пункту. Ведь в отличие от метки, у кластера нет события клик, есть только балунопен. А когда балун уже опен, то балуны меток подгружать по идее поздно. Тестирование ниже приведенного кода это подтверждает (хотя, может быть, я в коде что-то напутала...) У меня балун открывается пустой.

ymaps.ready(init);
function init () {
var myMap = new ymaps.Map('map', {
      center: [44.88564041463957,37.319950461387634],
      zoom: 5,
      controls: ['fullscreenControl', 'rulerControl', 'typeSelector', 'zoomControl']
}, { autoFitToViewport: 'always'});
myMap.behaviors.disable('scrollZoom');

var list = ymaps.templateLayoutFactory.createClass([
      '',
      '{% for geoObject in properties.geoObjects %}',
          '{{ geoObject.properties.balloonContent|raw }}',
      '{% endfor %}',
      ''
].join(''));

var clusterer = new ymaps.Clusterer({
      preset: 'islands#invertedBlueClusterIcons',
      groupByCoordinates: false,
      clusterDisableClickZoom: true,
      clusterOpenBalloonOnClick: true,
      clusterBalloonPanelMaxMapArea: 0,
      clusterBalloonMaxHeight: 300,
      clusterBalloonContentLayout: list
});

var marker = [];
marker[536924] = new ymaps.Placemark([44.8833333, 37.3166667], {
    myID: 536924,
    balloonContentBody: ''
}, {
    iconLayout: 'islands#blueDotIcon'
});
clusterer.add(marker[536924]);
marker[536927] = new ymaps.Placemark([44.863043, 37.380112], {
    myID: 536927,
    balloonContentBody: ''
}, {
    iconLayout: 'islands#blueDotIcon'
});
clusterer.add(marker[536927]);
marker[536929] = new ymaps.Placemark([44.8710903881978, 37.3340710226646], {
    myID: 536929,
    balloonContentBody: ''
}, {
    iconLayout: 'islands#blueDotIcon'
});
clusterer.add(marker[536929]);

clusterer.events.add('balloonopen', function (e) {
    var cluster = e.get('cluster');
    var placemarks = cluster.getGeoObjects();
    var ids = [];
    $.each(placemarks, function(i, placemark) {
      if(placemark.properties.get('balloonContentBody').length == 0) {
        ids.push(placemark.properties.get("myID"));
      }
    });
    if(ids.length) {
      $.ajax({
            url: "/objectballoon",
            type: 'post',
            data: 'ids='+ids.join(',')
        }).done(function(result) {
            var json = $.parseJSON(result);
        if(Object.keys(json).length > 0) {
              $.each(json, function(i, point) {
            marker[i].properties.set({
              balloonContentBody: point
            });
              });
        }
        });
    }
});

myMap.geoObjects.add(clusterer);
myMap.setBounds(clusterer.getBounds(), {
      checkZoomRange: true
});
}

Список меток приведен для примера, меток намного больше и кластеризовать их необходимо.

mari-na-bzzz

27 января 2016, 23:33

У кластера есть событие click