Клуб API Карт

Метка по собственному шаблону: не работает клик.

toptj@toptj.com
3 января 2015, 04:12

Добрый день!

Создаю метку по своему шаблону:

1. Имеется svg файл, который используется в качестве основного изображения метки. 

2. Имеется иконка банка которую надо совместить с основной меткой. Иконок банков около 900.

Что сделал:

1. Создал шаблон:

 

 var bankLayoutClass = ymaps.templateLayoutFactory.createClass('<ymaps class="bankMapPoint type{{properties.branchTypeId}}" ><img class="icon" src="{{properties.bankIconUrl}}" /></ymaps>');
ymaps.layout.storage.add('bank#bankLayoutClass', bankLayoutClass);

  

2. Создаю метку:

 

placemark = new ymaps.Placemark([item.Latitude, item.Longitude], {
    id: item.ComponentId,
    branchTypeId: item.BranchTypeId,
    balloonContentHeader: GetBranchTypeName(item.BranchTypeId)
}, {
    iconLayout: 'bank#bankLayoutClass',
    balloonPanelMaxMapArea: 0,
    openEmptyBalloon: true
});

 

3. Создал CSS:

 

 

.bankMapPoint
{
  display:block;
  position:absolute;
  box-sizing:content-box;
  background-size:35px 50px;
  width:35px;
  height:50px;
  z-index:auto;
  background:url('/content/images/MapPoint.svg') no-repeat no-repeat center center transparent;
}

.bankMapPoint img.icon
{
  position:absolute;
  left:9px;
  top:7px;
}

 

 

Карта вроде создается корректно, но метки, созданные по этому шаблону, не кликаются.

Если, например, использовать встроенный шаблон default#image, то все работает нормально.

Помогите разобраться, подскажите где грабли

работающий пример: http://www.superbanki.ru/banks/sberbank/branches/moskva/

3 комментария
Это уже много раз спрашивали. В 2.1 надо шейп задать для иконки - опция iconShape

Спасибо за ответ!

Про шейп на форуме читал. В феврале 2014 года вроде как обещали автоматом выставлять прямоугольную форму. 

У меня решилось через установку в опциях iconShape:

                      iconShape: {

                        type: 'Rectangle',

                        // Прямоугольник описывается в виде двух точек - верхней левой и нижней правой.

                        coordinates: [

                            [-17, -50], [18, 0]

                        ]

                   },

Второй вопрос возник. Если по собственным шаблонам надо выставлять iconShape, почему они автоматом работают со встроенными шаблонами?

Может при создании шаблона можно указать форму, а не при создании метки?

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

Можно завернуть макет + шейп в preset (добавить в option.presetStorage), тогда будет удобно выставлять меткам через опцию preset.