Режим редактирования объектов

В режиме редактирования пользователь карты может изменять положение вершин графических объектов (ломаных и многоугольников), удалять уже добавленные вершины и добавлять новые.

Чтобы включить режим редактирования ломаной вызовите метод startEditing(), а чтобы выключить - метод stopEditing(). Для многоугольника: startEditing() и stopEditing(), соответственно.

Вызывать метод startEditing() следует уже после того, как ломаная или многоугольник добавлены на карту.

Чтобы изменить положение вершины, перетащите прямоугольную белую метку, которой обозначена вершина, на новое место.

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

Чтобы вызвать контекстное меню для вершины, щелкните на ней кнопкой мыши. Чтобы удалить вершину, щелкните по ней дважды.

Открыть пример редактирования ломаной в новом окне

Открыть пример редактирования многоугольника в новом окне

Настройки режима редактирования

Для того, чтобы указать настройки режима редактирования ломаной, на вход метода setEditingOptions() передайте (в качестве параметра) объект настроек YMaps.PolylineEditingOptions. Для многоугольника, соответственно, на вход метода setEditingOptions() передайте объект класса YMaps.PolygonEditingOptions.

Большинство настроек режима редактирования унаследованы от класса YMaps.GraphicsEditingOptions:

• drawing - включает режим добавления новых вершин в фигуру по щелчку кнопкой мыши на карте;
• drawOver - разрешает добавлять вершины поверх объектов карты в режиме добавления вершин;
• maxPoints - максимально допустимое число вершин;
• menuManager - диспетчер контекстного меню, открывающегося по щелчку кнопкой мыши по вершине фигуры, см. Диспетчер контекстного меню;
• onDblClick - обработчик двойного щелчка кнопкой мыши по вершине фигуры;
• stopDrawingByDblClick - включает возможность выхода из режима добавления вершин по двойному щелчку кнопкой мыши.

В примере ниже устанавливаются следующие настройки ломаной:

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

// Устанавливает настройки режима редактирования ломаной
polyline.setEditingOptions({
    drawing: true,
    maxPoints: 5
});

Открыть пример в новом окне

Опция ломаной fromStart указывает, куда будут добавляться новые вершины: в начало или в конец линии. За начало ломаной принимается вершина с наименьшим индексом. По умолчанию вершины добавляются в конец ломаной (fromStart = false).

Опция многоугольника fromIndex указывает индекс вершины, после которой будут добавляться новые вершины. По умолчанию используется вершина с наибольшим индексом.

Диспетчер контекстного меню

Диспетчер позволяет управлять содержимым контекстного меню, которое вызывается по щелчку левой кнопкой мыши на вершине графического объекта.

В контекстное меню можно добавить новые пункты, изменить стандартные и удалить ненужные. Идентификаторы стандартных пунктов меню перечислены в статическом объекте YMaps.GraphicsEditingMenuIDs.

По умолчанию контекстное меню содержит следующие пункты:

• "Продолжить" - продолжить линию от текущей вершины (у ломаной - только для начала и конца линии, у многоугольника - для всех вершин). В режиме редактирования данный пункт заменяется на "Завершить", позволяющий завершить рисование фигуры.
• "Удалить" - удалить вершину.

Метод menuManager принимает два параметра: индекс вершины фигуры и массив объектов, описывающих пункты контекстного меню для этой вершины. Диспетчер может изменять данные, переданные в массиве.

Пример ниже добавляет в диспетчер меню пункт, позволяющий выйти из режима редактирования.

polyline.setEditingOptions({
     menuManager: function (index, menuItems) {
        menuItems.push({
            id: "StopEditing",
            title: "<span style=\"white-space:nowrap;\">Завершить редактирование<span>",
            onClick: function (polygon, pointIndex) {
                polygon.stopEditing();
            }
        });
        return menuItems;
    }
});

Открыть пример в новом окне