Геометрии

Описание

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

Класс DG.Path

Абстрактный класс, содержащий опции и константы векторных слоев (Polygon, Polyline, Circle). Никогда не используется напрямую.

Опции

Опция	Тип	По умолчанию	Описание
`stroke`	`Boolean`	`true`	Рисовать ли границу фигуры. Установите значение в `false`, чтобы отключить границы многоугольников или кругов.
`color`	`String`	`'#03f'`	Цвет границы.
`weight`	`Number`	`5`	Ширина границы в пикселях.
`opacity`	`Number`	`0.5`	Прозрачность границы.
`fill`	`Boolean`	depends	Заполнять ли геометрии цветом. Установите значение в `false`, чтобы отключить заполнение многоугольников или кругов.
`fillColor`	`String`	такой же, как `color`	Цвет заливки.
`fillOpacity`	`Number`	`0.2`	Прозрачность заливки.
`dashArray`	`String`	`null`	Строка шаблона границы. Не работает на canvas слоях (например, Android 2).
`lineCap`	`String`	`null`	Определяет фигуру, которая будет использована как наконечник геометрии, если у нее задана граница (stroke).
`lineJoin`	`String`	`null`	Определяет фигуру, которая будет использована на углах изгибов геометрии, если у нее задана граница (stroke).
`clickable`	`Boolean`	`true`	Если установлено значение `false`, тогда события мышки геометрии не обрабатываются.
`pointerEvents`	`String`	`null`	Устанавливает геометрии атрибут `pointer-events`, если для отрисовки используется SVG.
`className`	`String`	`''`	Добавляет класс в соотвествующий атрибут элемента.

События

Вы можете подписаться на следующие события используя эти методы.

Событие	Данные	Описание
`click`	`MouseEvent`	Вызывается при клике на объект.
`dblclick`	`MouseEvent`	Вызывается при двойном клике на объект.
`mousedown`	`MouseEvent`	Вызывается когда пользователь нажимает кнопку мышки на объекте.
`mouseover`	`MouseEvent`	Вызывается при наведении курсора мышки на объект.
`mouseout`	`MouseEvent`	Вызывается когда курсор мышки покидает область объекта.
`contextmenu`	`MouseEvent`	Вызывается при нажатии правой кнопкой мышки на объекте, предотвращает появление стандартного контекстного меню браузера.
`add`	`Event`	Вызывается при добавлении геометрии на карту.
`remove`	`Event`	Вызывается при удалении геометрии с карты.
`popupopen`	`PopupEvent`	Вызывается при открытии прикрепленного к геометрии балуна.
`popupclose`	`PopupEvent`	Вызывается при закрытии прикрепленного к геометрии балуна.

Методы

Метод	Возвращает	Описание
`addTo( <Map> map )`	`this`	Добавляет слой на карту.
`bindPopup( <String> html \| <HTMLElement> el \| <Popup> popup, <Popup options> options? )`	`this`	Привязывает к геометрии балун с HTML содержимым, который будет показан при клике.
`unbindPopup()`	`this`	Отключает отображение балуна при клике на геометрию.
`openPopup( <LatLng> latlng? )`	`this`	Открывает балун, предварительно привязанный методом bindPopup в указанной точке.
`getPopup()`	`Popup`	Возвращает балун, предварительно привязанный методом bindPopup.
`closePopup()`	`this`	Закрывает балун, привязанный к геометрии, если тот был открыт.
`bindLabel(<String> content, <Label options> options?)`	`this`	Добавляет всплывающую подсказку для геометрии или обновляет содержимое уже созданной.
`unbindLabel()`	`this`	Отвязывает всплывающую подсказку от геометрии.
`setStyle( <Path options> object )`	`this`	Изменяет внешний вид геометрии указанный в опциях класса Path.
`getBounds()`	`LatLngBounds`	Возвращает прямоугольные границы геометрии.
`bringToFront()`	`this`	Позиционирует слой поверх всех остальных.
`bringToBack()`	`this`	Позиционирует слой под остальными.
`redraw()`	`this`	Перерисовывает слой. Удобно при изменении координат геометрии.

Статические свойства

Константа	Тип	Значение	Описание
`SVG`	`Boolean`	depends	True при рендеринге с использованием SVG (true в большинстве современных браузеров).
`VML`	`Boolean`	depends	True при рендеринге с использованием VML (IE 6-8).
`CANVAS`	`Boolean`	depends	True при рендеринге с использованием Canvas (Android 2).
`CLIP_PADDING`	`Number`	`0.5` для SVG `0.02` для VML	Указывает, насколько расширена область обрезания геометрий вокруг текущей области просмотра. Маленькие значения означают, что вы увидите обрезанные геометрии при перетаскивании, большие понижают скорость отрисовки.

Класс DG.Polyline

Класс для отрисовки ломаных линий на карте. Расширяет Path.

// создаем красную ломаную из массива географических точек
var polyline = DG.polyline(latlngs, {color: 'red'}).addTo(map);

// подстраиваем центр карты и масштаб так, чтобы ломаную было видно
map.fitBounds(polyline.getBounds());

Конструктор

Конструктор	Использование	Описание
`DG.Polyline( <LatLng[]> latlngs, <Polyline options> options? )`	`DG.polyline(…)`	Создает объект ломаной по переданному массиву географических точек и необязательному объекту опций.

Опции

Возможно использование опций класса Path и дополнительных опций:

Опция	Тип	По умолчанию	Описание
`smoothFactor`	`Number`	`1.0`	Степень упрощения ломаной на каждом уровне масштаба. Большее значение означает выше производительность и меньшее качество, меньшее значение — лучшее качество, но ниже производительность.
`noClip`	`Boolean`	`false`	Отключает обрезание ломаной.

Методы

Возможно использование методов класса Path и дополнительных методов:

Метод	Возвращает	Описание
`addLatLng( <LatLng> latlng )`	`this`	Добавляет переданную точку в ломаную.
`setLatLngs( <LatLng[]> latlngs )`	`this`	Заменяет все точки ломаной массивом переданных географических точек.
`getLatLngs()`	`LatLng[]`	Возвращает массив точек геометрии.
`spliceLatLngs( <Number> index, <Number> pointsToRemove, <LatLng> latlng?, … )`	`LatLng[]`	Позволяет добавлять, удалять или заменять точки в ломаной. Синтаксис аналогичен Array#splice. Возвращает массив удаленных точек.
`getBounds()`	`LatLngBounds`	Возвращает границы ломаной.
`toGeoJSON()`	`Object`	Возвращает GeoJSON представление ломаной (GeoJSON LineString).

Класс DG.Polygon

Класс для отрисовки многоугольников на карте. Расширяет Polyline.

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

Конструктор

Конструктор	Использование	Описание
`DG.Polygon( <LatLng[]> latlngs, <Polyline options> options? )`	`DG.polygon(…)`	Создает объект многоугольника по переданному массиву географических точек и необязательному объекту опций. Возможно также создать многоугольник с дырками, передав массив массивов latlngs, первый latlngs массив отвечает за внешние границы, остальные описывают область внутри.

Методы

У многоугольника те же опции и методы, что и у ломаной, но с некоторыми отличиями.

Метод	Возвращает	Описание
`toGeoJSON()`	`Object`	Возвращает GeoJSON представление многоугольника (GeoJSON Polygon).

Класс DG.Rectangle

Класс для отрисовки прямоугольников на карте. Расширяет Polygon.

// создаем географические границы прямоугольника
var bounds = [[54.9801, 82.8974], [54.9901, 82.9074]];

// создаем оранжевый прямоугольник
DG.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);

// подстраиваем центр карты и масштаб так, чтобы прямоугольник было видно
map.fitBounds(bounds);

Конструктор

Конструктор	Использование	Описание
`DG.Rectangle( <LatLngBounds> bounds, <Path options> options? )`	`DG.rectangle(…)`	Создает объект прямоугольника по переданным географическим границам и необязательному объекту опций.

Методы

Возможно использование методов класса Path и дополнительно следующих методов:

Метод	Возвращает	Описание
`setBounds( <LatLngBounds> bounds )`	`this`	Перерисовывает прямоугольник согласно переданных границ.

Класс DG.Circle

Класс для отрисовки круга на карте. Расширяет CircleMarker.

DG.circle([54.98, 82.89], 200).addTo(map);

Конструктор

Конструктор	Использование	Описание
`DG.Circle( <LatLng> latlng, <Number> radius, <Path options> options? )`	`DG.circle(…)`	Создает объект круга по переданной географической точке, радиусу в метрах и необязательному объекту опций.

Методы

Метод	Возвращает	Описание
`getLatLng()`	`LatLng`	Возвращает текущее географическое положение круга.
`getRadius()`	`Number`	Возвращает текущий радиус круга, значение в метрах.
`setLatLng( <LatLng> latlng )`	`this`	Устанавливает новое положение круга.
`setRadius( <Number> radius )`	`this`	Устанавливает радиус круга, значение в метрах.
`toGeoJSON()`	`Object`	Возвращает GeoJSON представление круга (GeoJSON Point).

Класс DG.CircleMarker

Круг фиксированного размера с радиусом указанным в пикселях. Расширяет Path.

Конструктор

Конструктор	Использование	Описание
`DG.CircleMarker( <LatLng> latlng, <Path options> options? )`	`DG.circleMarker(…)`	Создает объект круга по переданной географической точке и необязательному объекту опций. Значение радиуса по умолчанию — 10 пикселей.

Методы

Метод	Возвращает	Описание
`setLatLng( <LatLng> latlng )`	`this`	Устанавливает позицию круга.
`setRadius( <Number> radius )`	`this`	Устанавливает радиус круга, значение в пикселях.
`toGeoJSON()`	`Object`	Возвращает GeoJSON представление круга (GeoJSON Point).