Редактор маршрута
Модуль предоставляет возможность использования визуального редактора маршрутов. Редактор реализован в виде элемента управления, который позволяет задавать начальную и конечную точки, точки остановки и промежуточные точки маршрута в визуальном режиме. Маршрут между заданными точками прокладывается автоматически.
Внимание
Перед использованием модуля его необходимо подключить.
После загрузки модуля становится доступным пространство имен YMaps.RouterEditor и соответствующие классы.
Размещение редактора маршрута на карте
Редактор маршрута реализован в виде двух классов: YMaps.RouterEditor.DragAndDropEditor и YMaps.RouterEditor.RouterModel. Первый отвечает за визуальный интерфейс редактора. Второй предназначен для хранения результатов обращения к маршрутизатору. Чтобы использовать редактор маршрутов, необходимо создать экземпляры обоих указанных классов.
Класс YMaps.RouterEditor.DragAndDropEditor расширяет класс YMaps.IControl и размещается на карте так же, как и любой другой элемент управления:
// Создание экземпляров модели и редактора.
var routerModel = new YMaps.RouterEditor.RouterModel()
**var editor = new YMaps.RouterEditor.DragAndDropEditor(routerModel);**
// Размещение редактора на карте.
**map.addControl(editor);**
// Включение режима добавления точек маршрута кликом по карте.
editor.startDrawing();
С редактором связана соответствующая модель — экземпляр YMaps.RouterEditor.RouterModel — отвечающая за хранение данных о маршруте.
Когда пользователь производит в редакторе какие либо действия с точками маршрута, происходит изменение данных в модели. И наоборот, при изменении данных в модели, происходит оповещение редактора, который перерисовывает маршрут в соответствии с изменениями данных. Таким образом, проложить маршрут в редакторе можно не только визуально, но и программно.
var map = new YMaps.Map( document.getElementById("YMapsID") );
// Установка центра, масштаба и типа карты.
map.setCenter(new YMaps.GeoPoint(37.60, 55.76), 13, YMaps.MapType.MAP);
// Создание экземпляров модели и редактора.
**var routerModel = new YMaps.RouterEditor.RouterModel();**
var editor = new YMaps.RouterEditor.DragAndDropEditor(routerModel, {
viaPointHintContent: 'Перетащите точку или удалите ёё двойным щелчком',
cursorHintContent: 'Перетащите метку, чтобы создать промежуточную точку',
maxPoints: 3
}
);
// Построение маршрута от ст. метро Белорусская до ст. метро Лубянка
// через промежуточную точку (37.602777, 55.745144).
routerModel.getRouteProvider().route({
wayPoints: ['Белорусская', new YMaps.GeoPoint(37.602777, 55.745144), 'Лубянка'],
viaPoints: [1],
options: { boundedBy: map.getBounds() } // область для геокодирования
},
function (rr) {
// Передача полученного результат в модель.
// Модель оповестит о новом маршруте редактор.
**routerModel.setRouterResult(rr);**
}
);
// Размещение редактора на карте.
map.addControl(editor);
Cтраница https://yandex.github.io/mapsapi-examples-old/html/router_editor_nav.html содержит пример построения маршрута из пункта отправления в различные пункты прибытия, выбираемые из списка.
Получение информации о проложенном маршруте
Для получения информации о построенном в редакторе маршруте необходимо обратиться к методу getRouterResult() модели, связанной с редактором. Модель возвратит результат работы маршрутизатора в виде экземпляра класса YMaps.RouterEditor.RouterResult. Ответ маршрутизатора содержится в поле response в виде объекта JSON.
Для упрощения обработки ответа маршрутизатора предназначен класс YMaps.RouterEditor.RouterResultHelper.
routerModel.getRouteProvider().route({
wayPoints: ['Белорусская', new YMaps.GeoPoint(37.604682, 55.752516), 'Лубянка'],
viaPoints: [1],
},
function (rr) {
// Передача полученного результат в модель.
// Модель оповестит о новом маршруте редактор.
routerModel.setRouterResult(rr);
// Вспомогательный класс для обработки ответа маршрутизатора.
**helper = new YMaps.RouterEditor.RouterResultHelper(rr);**
// Вывод протяженности построенного маршрута.
YMaps.jQuery('body').append( 'Протяженность маршрута ~ '
+ YMaps.humanDistance(**helper.getDistance()**) );
}
);