Клуб API Карт

Редактор маршрутов на touch-дисплее

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

Приветствую.

 

На устройствах в которых взаимодействие происходит через touch-дисплей (iPhone в частности), невозможно добавить транзитную точку (ViaPoint) в режиме редактирования.

 

Возможно ли каким то образом сделать работу с редактором возможной?

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

Спасибо!

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

Каким образом включаете редактор маршрутов?

На устройствах вроде ПК, где есть курсор всё работает отлично.

Включаю путем, который задокументирован - route.editor.start()

 

 

 

 

 

 

К сожалению, сейчас там программно зашито, чтобы виа-точка появлялась при наведении на полилинию, а при потере фокуса на полилинии скрывалась. Т.е. когда вы захотите захватить виа-точку, она уже будет скрыта. На maps.yandex.ru сейчас тоже нельзя добавить виа-точку на тач-дисплее. Скорее всего, добавим методы для программного добавления виа-точки в следующих релизах.

Эх!

Можно ли написать какой-то workaround для решения этой проблемы? К сожалению, я не знаком с архитектурой Яндекс.Карт, потому не знаю что можно для этого сделать. Перегрузка внутреннего метода, конструирование точки, что угодно?

Я пишу мобильное веб-приложение, одно из требований клиента - использование Яндекс.Карт, а сабж темы - последняя из задач.

Что можно придумать?

Проще всего вам будет ловить событие click на карте, вычислять координаты клика, формировать координаты нового маршрута и строить его заново.

Если покажется это сложным, написал вам небольшой workaround, но работает он для маршрута с одним path и не забудьте включить редактор маршрутов с отключенным флагом добавления путевых точек addWayPoints: false

            map.events.add('click', function (e) {
                var tc = [], pos = e.get('coordPosition');
                route.getViaPoints().each(function (p) { tc.push(p.geometry.getCoordinates().join(',')); });
                route.getPaths().events.fire('mouseenter', {
                    target: route.getPaths().get(0),
                    coordPosition: pos
                });
                route.getViaPoints().each(function (point, i) {
                    if (tc[i] != point.geometry.getCoordinates().join(',')) {
                        point.geometry.setCoordinates(pos);
                        point.events.fire('dragend');
                        return false;
                    }
                });
            });
P.S. этот решение может быть непригодно для следующих версий, в которых мы сможем предложить полноценное решение, поэтому зафиксируйте номер версии апи.

Спасибо за решение, Serjo! Я немного дополнил код - на карте перестал работать dblclick. Вот то, что получилось:

// Touch-devices workaround, see details at:
// http://clubs.ya.ru/mapsapi/replies.xml?item_no=32587
var map = route.getMap(), clickTimeout = 450, clicked = 0;
map.events.add('click', function (e) {
    clicked++;
    setTimeout(function() {
        if (clicked > 1 /* only single click appropriated */ || !clicked /* not prevented */) {
            clicked = 0;
            return;
        }
        clicked--; /* 0, if normal situation */

        var tc = [], clickCoordinates = e.get('coordPosition');
        route.getViaPoints().each(function (p) { tc.push(p.geometry.getCoordinates().join(',')); });
        route.getPaths().events.fire('mouseenter', {
            target       : route.getPaths().get(0),
            coordPosition: clickCoordinates
        });
        route.getViaPoints().each(function (point, i) {
            if (tc[i] != point.geometry.getCoordinates().join(',')) {
                point.geometry.setCoordinates(clickCoordinates);
                point.events.fire('dragend');
                return false;
            }
        });
    }, clickTimeout);
});