Клуб API Карт

Позиция для вставки своего балуна.

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

Здравствуйте. У меня вопрос к знатокам). Как можно прикрутить полностью свой балун (не layout) к карте, который будет появлятся когда будет клик по метке, проблема в том что нужно как-то его позиции указать чтобы он появился именно там где надо и реагировал на смещение карты... Это нужно для того чтобы такой балун мог вылазить за границы карты.

5 комментариев
Алексей Yarrr!
28 января 2016, 04:05

Слушайте события карты, клики на геоОбъектах (или хотспотах, что вы там пользуете), и меняйте положение балуна согласно изменениям. Но я почти уверен, что у вас не получится его передвигать без скрытия или использования домСобытий (весьма низкоуровнево), потому что они будут лежать в разных блоках и позиционироваться будут отдельно. Т.е. в идеале вам надо будет еще и при mousedown по карте вешать колбек на mousemove по этой же карте, где перемещать все, что угодно (в т.ч. и ваш балун), а при mouseup удалять этот колбек. А сам балун надо будет разместить где-то за пределами ymaps (хоть рядом, хоть на луне).

Насчет того что балун нужно разместить за пределы ymaps (хоть рядом, хоть на луне), это я понимаю и так и написал его отдельно)  мне нужно при клике узнать координаты клика(в идеале координаты метки(пиксельные)), и припустим что это у меня получится, то тогда проблема в том что когда карту начнешь двигать, мой балун будет оставаться на месте а метка для которой он был вызван, вовсе уйдет в сторону.  Для этого также нужно ловить перемещение карты, и сдвигать карту согласно перемещению карты. Но вот как все это реализовать пока не додумался)

Алексей Yarrr!
28 января 2016, 04:05

Нужно небольшое знание какого-нибудь jQuery. Смотрим какие события у нас есть: http://api.yandex.ru/maps/doc/jsapi/2.x/ref/reference/Map.xml

var mapOnMoving = false;

map.events.add('mousedown', function(e){

  mapOnMoving = true; // двигаемся

})

map.events.add('mouseup', function(e){

  mapOnMoving = false; // закончили

})

map.events.add('mousemove', function(e){

  if (!mapOnMoving) return; // ничего не делаем, если карта не двигается

  var pos = e.get('position'); // тут не уверен, но нам нужно получить текущие координаты

  pos[0] += offset[0]; // правим оффсет

  pos[1] += offset[1];

  $('#myballoon').position(pos); // и двигаем балун

})

И еще надо обязательно закрывать (или двигать) балун при boundschange.

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

Алексей Yarrr!
28 января 2016, 04:05

Кстати, на счет: в идеале координаты метки(пиксельные)

Учитывайте, что у api2.0 все завернуто в пустые 0пиксельные лайоуты, что позволяет все размещать относительно центра, а после изменения bounds - все координаты пересчитываются.

Спасибо, посмотрю что с этого получится)