Активные области-оверлеи

Одной из типовых задач применения активных областей является обозначение на карте районов, регионов или участков местности. Так как активные области не добавляют в DOM-дерево документа новых элементов, на карте можно разметить значительное количество объектов без потери времени на их отрисовку.

Поскольку активные области сами по себе не имеют визуального отображения, при наведении курсора на активную область на карту требуется добавлять объект-оверлей (метку или многоугольник), а при выходе курсора за границы области - удалять объект.

Класс YMaps.Hotspots.Overlay задает на карте активную область в виде объекта-оверлея и позволяет добавить свойства интерактивности объектам как стандартной, так и пользовательской карт.

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

Активная область-оверлей состоит из набора простейших геометрических фигур. Для создания активной области в конструктор класса YMaps.Hotspots.Overlay необходимо передать два параметра:

  • geometry - описание геометрии области. Область может состоять из множества простых геометрических фигур;
  • options - параметры активной области.

В свою очередь, геометрия каждой составляющей область фигуры описывается с помощью объекта с двумя полями:

  • shape - форма геометрической фигуры;
  • coords - массив координат вершин фигуры.

Доступны следующие формы фигур:

  • rect - прямоугольник;

    var figureRect = {
        shape: 'rect',
        coords: [ new YMaps.GeoPoint(10, 10), new YMaps.GeoPoint(20, 20) ]
    }
  • cpoly - выпуклый многоугольник;

    var figureCPoly = {
        shape: 'cpoly',
        coords: [
            new YMaps.GeoPoint(50, 10),
            new YMaps.GeoPoint(60, 30),
            new YMaps.GeoPoint(70, 20),
            new YMaps.GeoPoint(60, 10)
        ]
    }
  • npoly - невыпуклый многоугольник.

    var figureNPoly = {
        shape: 'npoly',
        coords: [
            new YMaps.GeoPoint(80, 10),
            new YMaps.GeoPoint(90, 30),
            new YMaps.GeoPoint(100, 10),
            new YMaps.GeoPoint(90, 20)
        ]
    }
Совет. Для каждой из перечисленных выше фигур границы активной области определяются по различным алгоритмам. Чем сложнее фигура, тем медленнее работает алгоритм, поэтому по возможности старайтесь использовать cpoly вместо npoly (любой невыпуклый многоугольник всегда можно разбить на несколько выпуклых).

Чтобы добавить активную область-оверлей на карту используйте метод карты addOverlay, а чтобы удалить -- метод removeOverlay.

Параметры активной области задаются с помощью объекта класса YMaps.Hotspots.OverlayOptions. Этот класс расширяет YMaps.InteractiveGeoObjectOptions следующими значениями:

  • interactive - интерактивность области на карте;
  • cursor - вид курсора мыши над активной областью;
  • priority - приоритет области на карте. Задается целым неотрицательным числом. При показе карты области с большим приоритетом будут перекрывать области с меньшим. Приоритет области можно изменить с помощью метода setOptions (по умолчанию 0).

Параметр interactive позволяет изменять степень реагирования активной области на действия пользователя. Этот параметр может принимать одно из следующих значений:

  • YMaps.Interactivity.INTERACTIVE (по умолчанию) - активная область обрабатывает действия со стороны пользователя и генерирует события класса YMaps.Hotspots.Overlay, см. справочник:
  • YMaps.Interactivity.STATIC - активная область не обрабатывает действия пользователя, но при это слушает и генерирует соответствующие события. В этом режиме пользователь может самостоятельно настроить реакцию геообъекта на события.
Примечание. В состоянии интерактивности YMaps.Interactivity.STATIC курсора мыши при наведении на область автоматически меняется. Чтобы запретить автоматическую смену курсора установите опцию YMaps.Cursor.INHERIT.

В состоянии YMaps.Interactivity.INTERACTIVE активная область обрабатывает действия пользователя в соответствии с опциями, заданными в конструкторе (либо через метод setOptions). Интерактивность дает следующие возможности:

  • показ всплывающей подсказки по наведению курсора мыши; управляется опцией YMaps.Hotspots.OverlayOptions.hasHint и по умолчанию отключен;
  • показ балуна по щелчку мыши на активной области; управляется опцией YMaps.Hotspots.OverlayOptions.hasBalloon и по умолчанию включен.