Как в Yandex Map Clusterer вывести содержимое как в кастомном Balloon?

Question

На карте отображаются маркеры, но при нажатие кнопки включаются кластеры. Кластеры создаются как в коде ниже. У маркера есть кастомный баллун созданный с помощью Ymaps.templateLayoutFactory.createClass(). Нужно этот же контент выводить в баллуне кластера. Но при замене myGeoObjects[1].properties.balloonContent на кастомный балун маркера - выводится строка function(){g.superclass.constructor.apply(this,arguments)}

Как вывести разметку из Ymaps.templateLayoutFactory.createClass()? Может не в то место записываю, balloonContent выводит только разметку типа '<div>fff</div>'.

Если создать разметку без Ymaps.templateLayoutFactory.createClass() и добавить ее в myGeoObjects[1].properties.balloonContent тогда все выводиться как надо. Но тогда не работают кнопки. Следовательно без Ymaps.templateLayoutFactory.createClass() не обойтись.

как выводится

должно выводиться так

Пример кода

// Создание карты, требующей кластеризации геообъектов
var map = new ymaps.Map('mapsID', { center: [56.034, 36.992], zoom: 8 }),
// Создание массива геообъектов
myGeoObjects = [];
myGeoObjects[0] = new ymaps.GeoObject({
    geometry: { type: "Point", coordinates: [56.034, 36.992] },
    properties: {
        clusterCaption: 'Geo object №1',
        balloonContentBody: 'Balloon content for geo object №1'
    }
});
myGeoObjects[1] = new ymaps.GeoObject({
    geometry: { type: "Point", coordinates: [56.021, 36.983] },
    properties: {
        clusterCaption: 'Geo object №2',
        balloonContentBody: 'Balloon content for geo object №2'
   }
});

// Создание кластера и запрещение масштабирования карты при щелчке по кластеру
var clusterer = new ymaps.Clusterer({ clusterDisableClickZoom: true });
clusterer.add(myGeoObjects);
map.geoObjects.add(clusterer);

Answer 1

Возможно, кнопки не работают потому, что каждый раз, когда рисуется балун, кнопки создаются заново, и обработчики нужно подцеплять опосредованно.

myGeoObjects[0] = new ymaps.GeoObject({
    geometry: { type: "Point", coordinates: [56.034, 36.992] },
    properties: {
        clusterCaption: 'Geo object №1',
        balloonContentBody: '<div><button class="btn-item-del" data-id="0">' +
                                'Удалить' +
                                '</button></div>'
    }
});

$('body').on('click', '.btn-item-del', function () {
            var $this = $(this);
            var id = $this.data('id');
            alert(id);
});

БЛОГ НА HUSL

Как в Yandex Map Clusterer вывести содержимое как в кастомном Balloon?

Ответы (1 шт):