Метка с динамическим содержимым. Проблема с определением размеров

Question

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

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

У меня случай когда нужно выводить название объекта в виде метки. У каждого объекта разное количество символов, поэтому определить ширину нет возможности.

Кто-то сталкивался с подобной проблемой? Возникла идея вставлять каждый блок в html и вычислять размеры, но это слишком долго и медленно, т.к. меток может быть очень много.

Answer 1

Нашел решение на форуме. может кому-то пригодится https://yandex.ru/blog/mapsapi/kak-sozdat-html-metku-s-povedeniem-obychnoy-metki-podskazka-i-balun

  var customIcon = ymaps.templateLayoutFactory.createClass(
 '<div class="theme-border theme-background" style="width: 0.6em; height: 
 0.6em; border-style: solid; border-width: 0.4em; border-radius: 100%; margin: 
 -0.7em;"></div>',
 {
     getShape: function()
     {
         var elem = this.getElement();
         if ( !elem )
             return null;

         var icon = elem.firstChild;

         return new ymaps.shape.Rectangle( new ymaps.geometry.pixel.Rectangle([
             [ icon.offsetLeft, icon.offsetTop ],
             [ icon.offsetLeft + icon.offsetWidth, icon.offsetTop + icon.offsetHeight ]
         ]));
     }
 }
);
var placemark = new ymaps.Placemark(
 [ 43, 56 ],
 { hintContent: 'Метка', balloonContent: 'Описание' },
 { iconLayout: customIcon }
);
myMap.geoObjects.add( placemark );
 ```

БЛОГ НА HUSL

Метка с динамическим содержимым. Проблема с определением размеров

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