Клуб API Карт

Если на карте в событии mousedown создать geoObject, то mouseup и click не срабатывают!

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

Использую версию 2.0, столкнулся со странным поведением карты.

Для начала приведу код:

this.map.events.add('click', function(event) {
    console.info('mouse-click');
    // do nothing!
}, this);
this.map.events.add('mousedown', function(event) {
    console.info('mousedown');
    coords = event.get('coordPosition');
    var coords_A = [
        coords[0],
        coords[1]
    ];
    var coords_B = [
        coords[0] + 0.005,
        coords[1] - 0.005
    ];
    // координаты прямоугольника
    var r_coords = [coords_A, coords_B];
    // прямоугольник
    var rectangle = new ymaps.Rectangle(r_coords);
    this.map.geoObjects.add(rectangle);
}, this);
this.map.events.add('mouseup', function(event) {
    console.info('mouseup');
}, this);

 

Если внутри события mousedown создать geoObject и добавить его на карту, то

после нажатия кнопки мыши на карте ее недвигая отпустить, то событие mouseup не срабатывает, также как и событие click.

если после нажатия неотпуская передвинуть мышь - события срабатывают.

Что за мистика? Как починить?

Если вкратце: суть реализуемой задачи - по клику по карте добавлять прямоугольник и, если не отпускали мышь, то менять размер созданного прямоугольника.

 

 

9 комментариев

Я сейчас делаю такой пример для этого клуба.

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

На момент публикации его в Блоге АПИ (в ближайшее время) он будет в окончательном "правильном" варианте. Пока могу предложить взгянуть на драфт.

Если в кратце - геообъекты (по-умолчанию) перехватывают события mouseup и mousemove, поэтому они не доходят до карты.

Нужно выставить им модель интерактивности "default#transparent" или подписать их на эти же события.

Sergey Konstantinov
28 января 2016, 02:43
Не "и", а "или" :)

Спасибо, поправил. )))

Спасибо за помощь.
А реализация draggable:true, если не удалять прямоугольник после "рисования" возможна?

почему бы и нет.

это просто пример, вы можете дописать свою логику, как нужно вам

После рисования прямоугольник не удаляю, пробую реализовать draggable - в options добавляю {draggable: true}.

Т.к. события прямоугольника (клик на нем) прокидываются на карту - в событии onMapMouseUp добавляю:

            if (this._selectedArea) {
                this._selectedArea.options.set({interactivityModel: 'default#opaque'})
                console.info(this._selectedArea.options.get('interactivityModel')); // показывает, что все верно
            }

но при первом клике на прямоугольнике все-равно прокидывается событие mousedown в карту (поэтому начала перетаскивается текущий прямоугольник, а затем начинает рисоваться новый),
при повторных кликах на этом прямоугольнике все работает как надо.

Что я делаю не так?



 

И еще вопрос, ответ на который не смог найти в документации:
как быть с поведением карты "drag" при рисовании? Можно ли рисовать, нажимая правую кнопку мышки?
Пробовал через событие "contextmenu", но тогда событие "mouseup" почему-то срабатывает _перед_ событием "contextmenu", в общем, работает не так как ожидалось.

Как вариант, делаю кнопки смещения карты вверх/вниз/вправо/влево, т.к. в яндекс-картах, в отличии от гугла, по-умолчанию не предоставляется навигациюнная кнопка перемещения области карты (стрелочки).

думаю этот функционал не совместим с драгом карты

либо драг либо рисовать.

Может вам интерфейсно решить эту проблему, -

сделать кнопку как на http://maps.yandex.ru/

"переместить карту" при включенной - драгается карта,

при выключенной - рисуется область

Я пришел к такому же решению. Спасибо.