Геометрии

Введение

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

Предполагается, что вы уже ознакомились с разделами «Быстрый старт» и «Карта».

Основы

Геометрии

Геометрии — это специальные геометрические объекты на карте. В настоящий момент мы поддерживаем следующие геометрий: точки, мультиточки, круги, полилайны, мультиполилайны, полигоны, мультиполигоны. Каждый из этих типов геометрии задаются соответствующими классами:

  • Класс точки DG.Geometries.Point
  • Класс мультиточки DG.Geometries.Multipoint
  • Класс круга DG.Geometries.Circle
  • Класс полилайна DG.Geometries.Polyline
  • Класс мультиполилайна DG.Geometries.Multipolyline
  • Класс полигона DG.Geometries.Polygon
  • Класс мультиполигона DG.Geometries.Multipolygon

Группы геометрий

Каждая геометрия должна принадлежать определенной группе. Это дает возможность выполнять групповые операции.

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

Объект группы предоставляет наиболее полный арсенал методов, для управления геометриями.

Любые операции с геометриями в группе сразу же отображаются на карте.

Менеджер геометрий

Менеджер отвечает за управление группами. А группы, в свою очередь, управляют геометриями.

При этом для удобства часть методов по работе с геометриями есть также и в менеджере.

Менеджер геометрий, который доступен как свойство geometries объекта карты:

// Инициализируем объект карты:
var myMap = new DG.Map("myMapId");

// Менеджер геометрий:
myMap.geometries;

Класс стилей геометрий DG.Style.Geometry

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

Для наглядности допустим, что myStyle — объект класса DG.Style.Geometry.

Конструктор

Конструктор может принимать объект с атрибутами аналогичными атрибутам класса.

Свойства

Имя Тип Описание
strokeColor String Цвет линий и контуров. Задается в формате RGB (например, #00FF7F, #FF0000) или названием цвета (например, red, white, green). По умолчанию цвет черный: #000000.
strokeOpacity Number Прозрачность линий и контуров. Задается в диапазоне 0.0 (полная прозрачность) — 1.0 (без эффекта прозрачности). По умолчанию равен единице.
strokeWidth Number Толщина линий и контуров (в пикселах). По умолчанию равен единице.
fillColor String Цвет заливки. Только для круга и многоугольника. Задается в формате RGB (например, #00FF7F, #FF0000) или названием цвета (например, red, white, green). По умолчанию цвет белый: #FFFFFF
fillOpacity Number Прозрачность заливки. Только для круга и многоугольника. Задается в диапазоне 0.0 (полная прозрачность) — 1.0 (без эффекта прозрачности). Значение по умолчанию: 0.5.
strokeLinecap String Форма концов линии. Только для ломаных. Возможные варианты: square — плоский конец линий, round — закругленный конец линий. Значение по умолчанию: round.
strokeDashstyle String Стиль линии. Возможные варианты: solid — сплошная линия, dot — отображение точками (пунктирная), dash — штриховая линия, longdash — длинные штрихи, dashdot — штрих-пунктирная линия, longdashdot — длинные штрихи с точками. Значение по умолчанию: solid.
pointRadius Number Радиус точки в пикселях, по умолчанию равен единице. Только для точек и мультиточек.

Пример:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;
style.pointRadius = 5;
Открыть пример в новом окне

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

Пример 2:

// Создаем объект стилей из объекта:
var style = new DG.Style.Geometry({strokeColor : "blue", strokeOpacity : 1, strokeWidth : 3, fillColor : "#ff00ff", fillOpacity : 0.4, pointRadius : 5});

Класс точки DG.Geometries.Point

Ниже мы подробно рассмотрим конструктор и все методы класса точки. Для наглядности, допустим myPoint — объект точки.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
position DG.GeoPoint Да Географическое положение точки.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор точки, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на точку.

Пример:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;
style.pointRadius = 5;

// Создаем точку с указанием координат, радиуса и стиля:
var myPoint = new DG.Geometries.Point(new DG.GeoPoint(82.927810142519,55.028936234826), style);

// Добавим точку на карту:
myMap.geometries.add(myPoint);

Методы

Получить идентификатор точки
myPoint.getId()

Возвращает:

Тип Описание
String Идентификатор точки
Получить идентификатор DOM-элемента точки
myPoint.getContainerId()

Возвращает:

Тип Описание
String Свойство «id» DOM-элемента точки
Получить координаты точки
myPoint.getPosition()

Возвращает:

Тип Описание
DG.GeoPoint Географическое положение точки.
Задать новые координаты точки
myPoint.setPosition(position)

Параметры:

Имя Тип Обязательный Описание
position DG.GeoPoint Да Географическое положение точки.
Получить стиль точки
myPoint.getStyle()

Возвращает:

Тип Описание
DG.Style.Geometry Объект DG.Style.Geometry, который описывает внешний вид геометрии.
Установить стиль точки
myPoint.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
Скрыть точку
myPoint.hide()
Показать точку
myPoint.show()
Переместить точку на передний план
myPoint.toFront()
Переместить точку на задний план
myPoint.toBack()
Получить содержимое подсказки точки
myPoint.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки точки.
Установить новое содержимое подсказки точки
myPoint.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки точки.

Класс мультиточки (множества точек) DG.Geometries.Multipoint

Ниже мы подробно рассмотрим конструктор и все методы класса мультиточки.

Мультиточка — это геометрическая фигура, состоящая из одной и более точек. Для наглядности, допустим myMultipoint — объект мультиточки.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
geoPoints Array Да Массив объектов DG.GeoPoint. Объекты содержат в себе географическое координаты точек, входящих в мультиточку.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор мультиточки, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на мультиточку.

Пример:

// Создаём объект стилей:
 var style = new DG.Style.Geometry();
 // Устанавливаем значения свойств:
 style.strokeColor= "blue";
 style.strokeOpacity= 1;
 style.strokeWidth= 3;
 style.pointRadius = 5;

 // Устанавливаем координаты точек мультиточки:
 var geoPoints = [
     new DG.GeoPoint(20.426320303105, 54.62289941523),
     new DG.GeoPoint(20.436320303105, 54.63289941523),
     new DG.GeoPoint(20.426320303105, 54.64289941523),
     new DG.GeoPoint(20.446320303105, 54.65289941523),
     new DG.GeoPoint(20.426320303105, 54.66289941523),
     new DG.GeoPoint(20.436320303105, 54.67289941523)
 ]

 // Создаём мультиточку:
 var multipoint = new DG.Geometries.Multipoint(geoPoints, style, 'myMultipoint');

 // Добавим мультиточку на карту:
 myMap.geometries.add(multipoint);

В результате мы получим новый объект на карте — мультиточку из 6-ти синих точек с полями толщиной 3 пикселя и радиусом 5 пикселей.

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

Методы

Получить идентификатор мультиточки
myMultipoint.getId()

Возвращает:

Тип Описание
String Идентификатор мультиточки
Получить идентификаторы DOM-элементов точек мультиточки
myMultipoint.getContainerId()

Возвращает:

Тип Описание
Array Свойства «id» DOM-элементов точек, которые входят мультиточку
Получить границы мультиточки
myMultipoint.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается мультиточка.
Получить количество точек в мультиточке
myMultipoint.getNumPoints()

Возвращает:

Тип Описание
Number Количество точек, из которых состоит мультиточка.
Получить географические координаты точек мультиточки
myMultipoint.getGeoPoints()

Возвращает:

Тип Описание
Array Массив объектов DG.GeoPoint. Объекты содержат в себе географическое координаты точек, входящих в мультиточку.
Получить стиль мультиточки
myMultipoint.getStyle()

Возвращает:

Тип Описание
DG.Style.Geometry Объект DG.Style.Geometry, который описывает внешний вид геометрии.
Установить новый стиль мультиточки
myMultipoint.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry, который описывает внешний вид геометрии.
Скрыть мультиточку
myMultipoint.hide()
Показать мультиточку
myMultipoint.show()
Переместить мультиточку на передний план
myMultipoint.toFront()
Переместить мультиточку на задний план
myMultipoint.toBack()
Получить содержимое подсказки мультиточки
myMultipoint.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки мультиточки.
Установить новое содержимое подсказки мультиточки
myMultipoint.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки мультиточки.

Класс круга DG.Geometries.Circle

Ниже мы подробно рассмотрим конструктор и все методы класса круга. Для наглядности допустим, что myCircle — объект круга.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
center DG.GeoPoint Да Географическое положение точки — центра круга.
radius Number Да Радиус круга в метрах.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор круга, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на круг.

Пример:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;

// Создаем круг с указанием координат центра, радиуса и стиля:
var myCircle = new DG.Geometries.Circle(new DG.GeoPoint(82.927810142519,55.028936234826), 20, style);

// Добавим круг на карту:
myMap.geometries.add(myCircle);

Методы

Получить идентификатор круга
myCircle.getId()

Возвращает:

Тип Описание
String Идентификатор круга
Получить идентификатор DOM-элемента круга
myCircle.getContainerId()

Возвращает:

Тип Описание
String Свойство «id» DOM-элемента круга
Получить центр круга
myCircle.getCenter()

Возвращает:

Тип Описание
DG.GeoPoint Географическое положение точки — центра круга.
Получить радиус круга
myCircle.getRadius()

Возвращает:

Тип Описание
Number Радиус круга в метрах
Получить границы круга
myCircle.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается круг
Установить радиус круга
myCircle.setRadius(radius)

Параметры:

Имя Тип Обязательный Описание
radius Number Да Радиус круга в метрах
Установить стиль круга
myCircle.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
Скрыть круг
myCircle.hide()
Показать круг
myCircle.show()
Переместить круг на передний план
myCircle.toFront()
Переместить круг на задний план
myCircle.toBack()
Получить содержимое подсказки круга
myCircle.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки круга.
Установить новое содержимое подсказки круга
myCircle.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки круга.

Класс ломаной DG.Geometries.Polyline

Ниже мы подробно рассмотрим конструктор и все методы класса ломаной линии.

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

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
points Array Да Массив объектов DG.GeoPoint, каждый из который представляет собой географическое положение точки ломаной линии.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор ломаной, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на ломаную линию.

Пример:

// Создаем объект стилей:
var style = new DG.Style.Geometry();

// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;

// Устанавливаем координаты точек полилайна:
var pointSet = [
    new DG.GeoPoint(82.927810142519,55.028936234826),
    new DG.GeoPoint(82.928810143519,55.028936234826),
    new DG.GeoPoint(82.928810143519,55.039936234826),
    new DG.GeoPoint(82.938810142519,55.049996234826),
    new DG.GeoPoint(82.925810142519,55.048936234826)
    ];

// Создаем полилайн:
    var myPolyline = new DG.Geometries.Polyline(pointSet, style);

// Добавим на карту:
    myMap.geometries.add(myPolyline);

В результате мы получим новый объект на карте — многоугольник из 5 точек, соединенных синими линиями толщиной 3 пиксела и полупрозрачной розовой заливкой.

Методы

Для наглядности допустим, что myPolyline — ломаная, объект геометрии.

Получить идентификатор ломаной
myPolyline.getId()

Возвращает:

Тип Описание
String Идентификатор ломаной
Получить идентификатор DOM-элемента ломаной
myPolyline.getContainerId()

Возвращает:

Тип Описание
String Свойство «id» DOM-элемента ломаной
Получить границы ломаной
myPolyline.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается ломаная
Получить количество точек в ломаной
myPolyline.getNumPoints()

Возвращает:

Тип Описание
Number Количество точек в ломаной
Получить точку ломаной по ее порядковому номеру
myPolyline.getPoint(index)

Параметры:

Имя Тип Обязательный Описание
index Number Да Порядковый номер точки ломанной. Нумерация начинается с нуля.

Возвращает:

Тип Описание
DG.GeoPoint Географическое положение точки
Получить массив точек ломаной
myPolyline.getPoints()

Возвращает:

Тип Описание
Array Массив объектов DG.GeoPoint, каждый из который представляет собой географическое положение точки ломаной линии.
Добавить точку в ломаную
myPolyline.addPoint(point, index)

Параметры:

Имя Тип Обязательный Описание
point DG.GeoPoint Да Географическое положение точки.
index Number Нет Порядковый номер новой точки в ломаной. Нумерация начинается с нуля. Параметр позволяет вставить точку в любую позицию в ломаной. Если параметр не передан, точка будет добавлен в конец («хвост») ломаной линии.
Заменить точки ломаной
myPolyline.splicePoints(index, num, newPoints)

Параметры:

Имя Тип Обязательный Описание
index Number Да Индекс в массиве, с которого начинать вставку новых точек.
num Number Да Количество точек, которое требуется удалить, начиная с индекса index.
newPoints Array Да Добавляемый массив точек. Добавление начинается с позиции index

Поведение данной функции очень похоже на стандартный javascript-метод splice.

Установить новый стиль ломаной
myPolyline.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии
Скрыть ломаную
myPolyline.hide()
Показать ломаную
myPolyline.show()
Переместить ломаную на передний план
myPolyline.toFront()
Переместить ломаную на задний план
myPolyline.toBack()
Удалить точку ломаной по ее порядковому номеру
myPolyline.removePoint(index)

Параметры:

Имя Тип Обязательный Описание
index Number Да Порядковый номер точки ломанной. Нумерация начинается с нуля.

Возвращает:

Тип Описание
Boolean Возвращает true в случае успешного выполнения операции, false — в противном случае. Перед выполнением операции в ломаной линии должно быть минимум 3 точки.
Получить содержимое подсказки ломаной
myPolyline.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки ломаной.
Установить новое содержимое подсказки ломаной
myPolyline.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки ломаной.

Класс мультиполилайна (множества ломаных) DG.Geometries.Multipolyline

Ниже мы подробно рассмотрим конструктор и все методы класса мультиполилайна.

Мультиполилайн — это геометрическая фигура, состоящая из одной и более ломаных. Для наглядности, допустим myMultipolyline — объект мультиполилайна.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
pointSets Array Да Множество массивов объектов DG.GeoPoint. Подмассивы содержат в себе географическое координаты точек ломаных, входящих в мультиполилайн.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор мультиполилайна, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на мультиполилайн.

Пример:

// Создаём объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor= "blue";
style.strokeOpacity= 1;
style.strokeWidth= 3;

// Устанавливаем координаты точек для ломаных мультиполилайна:
var pointSets = [
 [
     new DG.GeoPoint(82.93, 55.028),
     new DG.GeoPoint(82.92, 55.038),
     new DG.GeoPoint(82.93, 55.048),
     new DG.GeoPoint(82.92, 55.058),
 ],
 [
     new DG.GeoPoint(82.95, 55.028),
     new DG.GeoPoint(82.94, 55.038),
     new DG.GeoPoint(82.95, 55.048),
     new DG.GeoPoint(82.94, 55.058),
 ],
 [
     new DG.GeoPoint(82.97, 55.028),
     new DG.GeoPoint(82.96, 55.038),
     new DG.GeoPoint(82.97, 55.048),
     new DG.GeoPoint(82.96, 55.058),
 ]
];

// Создаём мультиполилайн:
var multipolyline = new DG.Geometries.Multipolyline(pointSets, style, 'myMultipolyline');
myMap.geometries.add(multipolyline);

В результате мы получим новый объект на карте — мультиполилайн из 3-х синих ломаных линий толщиной 3 пикселя.

Методы

Получить идентификатор мультиполилайна
myMultipolyline.getId()

Возвращает:

Тип Описание
String Идентификатор мультиполилайна
Получить идентификаторы DOM-элементов ломаных мультиполилайна
myMultipolyline.getContainerId()

Возвращает:

Тип Описание
Array Свойства «id» DOM-элементов ломаных, которые входят в мультиполилайн
Получить границы мультиполилайна
myMultipolyline.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается мультиполилайн
Получить количество ломаных в мультиполилайне
myMultipolyline.getNumPolylines()

Возвращает:

Тип Описание
Number Количество полилайнов, из которых состоит мультиполилайн.
Получить географические координаты ломаных мультиполилайна
myMultipolyline.getPointSets()

Возвращает:

Тип Описание
Array Множество массивов объектов DG.GeoPoint. Подмассивы содержат в себе географическое координаты точек ломаных, входящих в мультиполилайн.
Установить новый стиль мультиполилайна
myMultipolyline.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
Скрыть мультиполилайн
myMultipolyline.hide()
Показать мультиполилайн
myMultipolyline.show()
Переместить мультиполилайн на передний план
myMultipolyline.toFront()
Переместить мультиполилайн на задний план
myMultipolyline.toBack()
Получить содержимое подсказки мультиполилайна
myMultipolyline.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки мультиполилайна.
Установить новое содержимое подсказки мультиполилайна
myMultipolyline.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки мультиполилайна.

Класс полигона (многоугольника) DG.Geometries.Polygon

Ниже мы подробно рассмотрим конструктор и все методы класса многоугольника.

Многоугольник представляет собой замкнутую ломаную линию и ограниченную ею часть плоскости. Для наглядности допустим, что myPolygon — объект полигона.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
points Array Да Массив объектов DG.GeoPoint, каждый из который представляет собой географическое положение точки (вершины) многоугольника.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор многоугольника, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на многоугольник.

Пример:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;

// Устанавливаем координаты точек (вершин) многоугольника:
var pointSet = [
    new DG.GeoPoint(82.927810142519,55.028936234826),
    new DG.GeoPoint(82.928810143519,55.028936234826),
    new DG.GeoPoint(82.928810143519,55.039936234826),
    new DG.GeoPoint(82.938810142519,55.049996234826),
    new DG.GeoPoint(82.927810142519,55.039936234826)
];

// Создаем многоугольник:
var myPolygon = new DG.Geometries.Polygon(pointSet, style);

// Добавим многоугольник на карту:
myMap.geometries.add(myPolygon);

В результате мы получим новый объект на карте — многоугольник из 5 точек, соединенных синими линиями толщиной 3 пиксела и полупрозрачной розовой заливкой.

Методы

Для наглядности допустим, что myPolygon — многоугольник, объект геометрии.

Получить идентификатор многоугольника
myPolygon.getId()

Возвращает:

Тип Описание
String Идентификатор многоугольника
Получить идентификатор DOM-элемента многоугольника
myPolygon.getContainerId()

Возвращает:

Тип Описание
String Свойство «id» DOM-элемента многоугольника
Получить границы многоугольника
myPolygon.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается многоугольник
Получить количество вершин в многоугольнике
myPolygon.getNumPoints()

Возвращает:

Тип Описание
Number Количество точек (вершин) в многоугольнике
Получить координаты вершины многоугольника по ее порядковому номеру
myPolygon.getPoint(index)

Параметры:

Имя Тип Обязательный Описание
index Number Да Порядковый номер точки (вершины) многоугольника. Нумерация начинается с нуля.

Возвращает:

Тип Описание
DG.GeoPoint Географическое положение точки
Получить массив вершин многоугольника
myPolygon.getPoints()

Возвращает:

Тип Описание
Array Массив объектов DG.GeoPoint, каждый из который представляет собой географическое положение вершины многоугольника.
Добавить новую вершину в многоугольник
myPolygon.addPoint(point, index)

Параметры:

Имя Тип Обязательный Описание
point DG.GeoPoint Да Географическое положение точки.
index Number Да

Порядковый номер новой точки в многоугольнике. Нумерация начинается с нуля.

Параметр позволяет вставить точку в любую позицию в многоугольника.

Если параметр не передан, точка будет добавлен в конец.

Заменить вершины многоугольника
myPolygon.splicePoints(index, num, newPoints)

Параметры:

Имя Тип Обязательный Описание
index Number Да Индекс в массиве, с которого начинать вставку новых точек.
num Number Да Количество точек, которое требуется удалить, начиная с индекса index.
newPoints Array Да Добавляемый массив точек. Добавление начинается с позиции index.

Поведение данной функции очень похоже на стандартный javascript-метод splice.

Установить новый стиль многоугольника
myPolygon.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
Скрыть многоугольник
myPolygon.hide()
Показать многоугольник
myPolygon.show()
Переместить многоугольник на передний план
myPolygon.toFront()
Переместить многоугольник на задний план
myPolygon.toBack()
Удалить вершину многоугольника по ее порядковому номеру
myPolygon.removePoint(index)

Параметры:

Имя Тип Обязательный Описание
index Number Да Порядковый номер точки ломанной. Нумерация начинается с нуля

Возвращает:

Тип Описание
Boolean

Возвращает true в случае успешного выполнения операции, false - в противном случае.

Перед выполнением операции в ломаной линии должно быть минимум 3 точки.

Получить содержимое подсказки многоугольника
myPolygon.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки многоугольника.
Установить новое содержимое подсказки многоугольника
myPolygon.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки многоугольника.

Класс мультиполигона (множества многоугольников) DG.Geometries.Multipolygon

Ниже мы подробно рассмотрим конструктор и все методы класса мультиполигона.

Мультиполигон — это геометрическая фигура, состоящая из одного и более полигонов. Для наглядности, допустим myMultipolygon — объект мультиполигона.

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

Конструктор

Параметры:

Имя Тип Обязательный Описание
pointSets Array Да Множество массивов объектов DG.GeoPoint. Подмассивы содержат в себе географическое координаты точек многоугольников, входящих в мультиполигон.
style DG.Style.Geometry Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор мультиполигона, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на мультиполигон.

Пример:

// Создаём объект стилей:
 var style = new DG.Style.Geometry();
 // Устанавливаем значения свойств:
 style.strokeColor= "blue";
 style.strokeOpacity= 1;
 style.strokeWidth= 3;

 // Устанавливаем координаты точек для многоугольников мультиполигона:
 var pointSets = [
     [
         new DG.GeoPoint(82.93, 55.028),
         new DG.GeoPoint(82.92, 55.038),
         new DG.GeoPoint(82.93, 55.048),
         new DG.GeoPoint(82.92, 55.058),
     ],
     [
         new DG.GeoPoint(82.95, 55.028),
         new DG.GeoPoint(82.94, 55.038),
         new DG.GeoPoint(82.95, 55.048),
         new DG.GeoPoint(82.94, 55.058),
     ],
     [
         new DG.GeoPoint(82.97, 55.028),
         new DG.GeoPoint(82.96, 55.038),
         new DG.GeoPoint(82.97, 55.048),
         new DG.GeoPoint(82.96, 55.058),
     ]
 ];

 // Создаём мультиполигон:
 var multipolygon = new DG.Geometries.Multipolygon(pointSets, style, 'myMultipolygon');
 myMap.geometries.add(multipolygon);

В результате мы получим новый объект на карте — мультиполигон, состоящий из 3-х многоугольников с синими линиями толщиной 3 пикселя.

Методы

Получить идентификатор мультиполигона
myMultipolygon.getId()

Возвращает:

Тип Описание
String Идентификатор мультиполигона
Получить идентификаторы DOM-элементов многоугольников мультиполигона
myMultipolygon.getContainerId()

Возвращает:

Тип Описание
Array Свойства «id» DOM-элементов многоугольников, которые входят в мультиполигон
Получить границы мультиполигона
myMultipolygon.getBounds()

Возвращает:

Тип Описание
DG.Bounds Прямоугольная область, в которую вписывается мультиполигон
Получить количество многоугольников в мультиполигоне
myMultipolygon.getNumPolygons()

Возвращает:

Тип Описание
Number Количество полигонов, из которых состоит мультиполигон.
Получить географические координаты многоугольников мультиполигона
myMultipolygon.getPointSets()

Возвращает:

Тип Описание
Array Множество массивов объектов DG.GeoPoint. Подмассивы содержат в себе географическое координаты точек многоугольников, входящих в мультиполигон.
Установить новый стиль мультиполигона
myMultipolygon.setStyle(style)

Параметры:

Имя Тип Обязательный Описание
style DG.Style.Geometry Да Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
Скрыть мультиполигон
myMultipolygon.hide()
Показать мультиполигон
myMultipolygon.show()
Переместить мультиполигон на передний план
myMultipolygon.toFront()
Переместить мультиполигон на задний план
myMultipolygon.toBack()
Получить содержимое подсказки мультиполигона
myMultipolygon.getHintContent()

Возвращает:

Тип Описание
String Cодержимое подсказки мультиполигона.
Установить новое содержимое подсказки мультиполигона
myMultipolygon.setHintContent(hint)

Параметры:

Имя Тип Обязательный Описание
hint String Да Новое содержимое подсказки мультиполигона.

Менеджер геометрий DG.Geometries

Менеджер отвечает за управление группами. А группы, в свою очередь, управляют геометриями.

При этом для удобства, часть методов по работе с геометриями есть также и в менеджере.

Ниже мы подробно рассмотрим все методы класса менеджера. Для наглядности допустим, что myMap — объект карты.

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

Создать менеджер маркеров явно через ключевое слово new нельзя. Он автоматически доступен как свойство geometries объекта карты.

Методы управления группами геометрий

Создание группы
myMap.geometries.createGroup(groupName)

Параметры:

Имя Тип Обязательный Описание
groupName String Да Название группы. Должно быть уникальным.

Возвращает:

Тип Описание
DG.GeometryGroup Экземпляр класс DG.GeometryGroup
Удалить группу
myMap.geometries.removeGroup(groupName)

Параметры:

Имя Тип Обязательный Описание
groupName String Да Название группы.
Получить список имен групп
myMap.geometries.getAllGroupsNames()

Возвращает:

Тип Описание
Array Список имен групп. Массив строк.
Получить уже созданный объект группы по ее имени
myMap.geometries.getGroup(groupName)

Параметры:

Имя Тип Обязательный Описание
groupName String Да Название группы.

Возвращает:

Тип Описание
DG.GeometryGroup | null Экземпляр класс DG.GeometryGroup, который уже был создан с помощью метода myMap.geometries.createGroup. Если запросить у метода несуществующую группу, возвращает null.
Получить имя группы по умолчанию
myMap.geometries.getDefaultGroupName()

Возвращает:

Тип Описание
String Название группы по умолчанию, которая есть всегда.
Получить объект группы по умолчанию
myMap.geometries.getDefaultGroup()

Возвращает:

Тип Описание
DG.GeometryGroup Объект группы по умолчанию, который есть всегда.

Фактически данный метод, является короткой записью выражения myMap.geometries.getGroup(myMap.geometries.getDefaultGroupName()

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

Далее рассмотрим часть методов по работы с геометриями, которые можно выполнить в менеджере. Если требуются более сложные операции, их можно выполнить средствами объекта группы.

Добавить геометрию
myMap.geometries.add(item, groupName)

Параметры:

Имя Тип Обязательный Описание
item Object Да Геометрия.
groupName String Нет

Название группы. Если параметр не передан, геометрия будет добавлена в группу по умолчанию. Если название группы новое, автоматически будет создана новая группа с переданным именем.

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

Удалить геометрию
myMap.geometries.remove(item)

Параметры:

Имя Тип Обязательный Описание
item Object | String Да Может быть либо объектом геометрии, либо его идентификатором. Для получения идентификатора у геометрии есть метод getId().
Получить список всех геометрий
myMap.geometries.getAll()

Возвращает:

Тип Описание
Array Массив, состоящий из экземпляров классов геометрий.
Получить геометрию по ее идентификатору
myMap.geometries.get(id)

Параметры:

Имя Тип Обязательный Описание
id String Да Идентификатор геометрии. Для его получения у геометрии есть метод getId().

Возвращает:

Тип Описание
Object | null Экземпляр класс геометрии. Если запросить у метода несуществующую геометрию, возвращает null.
Удалить все геометрии
myMap.geometries.removeAll()

Несмотря на удаление всех геометрий, группы остаются не тронутыми.

Получить границы геометрий
myMap.geometries.getBounds(groupName)

Параметры:

Имя Тип Обязательный Описание
groupName String нет Название группы; если не указано, то границы рассчитываются по всем элементам.
Создать геометрию из WKT

Метод является устаревшим. Рекомендуем использовать DG.WKTParser

myMap.geometries.createFromWKT(wkt, style, name, hint)

Параметры:

Имя Тип Обязательный Описание
wkt String Да Описание геометрии в формате WKT
style object Нет Объект DG.Style.Geometry. Настраивает внешний вид геометрии.
name String Нет Идентификатор геометрии, должен быть уникальным. Если параметр не передан, генерируется автоматически.
hint String Нет Подсказка, которая будет показана при наведении курсора на геометрию.

Возвращает:

Тип Описание
Object Возвращает объект геометрии, определенный в переменной wkt.

Формат WKT (Well-Known Text) — стандартный текстовый формат предоставления векторных географических объектов.

Для каждого вида геометрий существует свой формат текстового представления. Рассмотрим каждый из них.

Круг:

CIRCLE(centrePoint1Lon centrePoint1Lat circleRadius)

Где:

Имя Обязательный Описание
CIRCLE Да Вид геометрии. В данном случае — круг.
centrePoint1Lon Да Долгота. Координаты центра круга.
centrePoint1Lat Да Широта. Координаты центра круга.
circleRadius Да Радиус круга. В метрах.

Ломаная линия:

POLYLINE(point1Lon point1Lat, point2Lon point2Lat, ... , pointNLon pointNLat)

Где:

Имя Обязательный Описание
POLYLINE Да Вид геометрии. В данном случае - ломаная.
pointJLon Да Долгота. Координаты точек (где J = 1, 2, ... , N — порядковый номера точек ломаной)
pointJLat Да Широта. Координаты точек (где J = 1, 2, ... , N — порядковый номера точек ломаной)

Многоугольник:

POLYGON(point1Lon point1Lat, point2Lon point2Lat, ... , pointNLon pointNLat)

Где:

Имя Обязательный Описание
POLYGON Да Вид геометрии. В данном случае - многоугольник.
pointJLon Да олгота. Координаты точек (где J = 1, 2, ... , N — порядковый номера точек многоугольника)
pointJLat Да Широта. Координаты точек (где J = 1, 2, ... , N — порядковый номера точек многоугольника)

Пример создания круга:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;

// Создаем круг с описанием его в формате WKT:
var WKTCircle = myMap.geometries.createFromWKT('CIRCLE(82.927810142519 55.028936234826 32)', style, 'newCircle');

// Добавим круг на карту:
myMap.geometries.add(WKTCircle);

В результате мы получим новый объект на карте — круг с центром в точке с координатами (82.927810142519, 55.028936234826), радиусом 32 метра, с синим контуром и полупрозрачной розовой заливкой.

Пример создания ломаной линии:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;

// Создаем ломаную с указанием координат точек в формате WKT:
var WKTPolyline = myMap.geometries.createFromWKT('POLYLINE(82.9493668627659 55.0259446249702, 82.9516156956499 55.0269757389091, 82.9517821964664 55.0270148630815, 82.9518932099231 55.0270229691957, 82.952010468484 55.0270147064332, 82.9521700081814 55.0269878787236, 82.9523013600269 55.0269508970628, 82.9601314716496 55.0238948565076, 82.9834830482221 55.0142164518612)', style, 'newPolyline');

// Добавим ломаную на карту:
myMap.geometries.add(WKTPolyline);

В результате мы получим новый объект на карте — ломаную состоящую из 9 точек, соединенных синими линиями толщиной 3 пиксела.

Пример создания многоугольника:

// Создаем объект стилей:
var style = new DG.Style.Geometry();
// Устанавливаем значения свойств:
style.strokeColor = "blue";
style.strokeOpacity = 1;
style.strokeWidth = 3;
style.fillColor = "#ff00ff";
style.fillOpacity = 0.4;

WKTPolygon = myMap.geometries.createFromWKT('POLYGON(82.9493668627659 55.0259446249702, 82.9516156956499 55.0269757389091, 82.9517821964664 55.0270148630815, 82.9518932099231 55.0270229691957, 82.952010468484 55.0270147064332, 82.9521700081814 55.0269878787236, 82.9523013600269 55.0269508970628, 82.9601314716496 55.0238948565076, 82.9834830482221 55.0142164518612)', style, 'newPolygon');

// Добавим многоугольник на карту:
myMap.geometries.add(WKTPolygon);

В результате мы получим новый объект на карте — многоугольник состоящий из 9 точек, соединенных синими линиями толщиной 3 пиксела и полупрозрачной заливкой розового цвета.

Класс группы геометрий DG.GeometryGroup

Объект группы предоставляет наиболее полный арсенал методов для управления группами геометрий.

Ниже мы подробно рассмотрим все методы класса группы геометрий. Для наглядности допустим, что myGroup — объект группы.

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

Создать группу слоев явно через ключевое слово new нельзя. Правильно это делать с помощью метода createGroup менеджера геометрий.

Методы

Добавить геометрию в группу
myGroup.add(item, index)

Параметры:

Имя Тип Обязательный Описание
item Object Да Геометрия. Экземпляр класса геометрии.
index Number Нет

Порядковый номер добавляемой геометрии в группе. При этом нумерация геометрий начинается с нуля. Если параметр не передан, геометрия будет добавлен в конец группы.

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

Удалить геометрию из группы
myGroup.remove(item)

Параметры:

Имя Тип Обязательный Описание
item DG.Geometries.Circle | DG.Geometries.Polygon | DG.Geometries.Polyline Да Геометрия. Экземпляр класса геометрии.
Получить список всех геометрий в группе
myGroup.getAll()

Возвращает:

Тип Описание
Array Массив состоящий из экземпляров класса геометрии
Получить геометрию по ее идентификатору в группе
myGroup.get(id)

Параметры:

Имя Тип Обязательный Описание
id string Да Идентификатор геометрии. Для его получения у геометрии есть метод getId().
Удалить все геометрии из группы
myGroup.removeAll()

Несмотря на удаление всех геометрий из группы, сам объект группы остается не тронутыми.

Скрыть группу
myGroup.hide()

При этом все геометрии в группе становятся невидимыми. Более того, при добавлении новых геометрий они также остаются невидимыми.

Отобразить группу
myGroup.show()
Получить количество геометрий в группе
myGroup.length()

Возвращает:

Тип Описание
Number Возвращает количество геометрий в группе
Проверить наличие геометрии в группе
myGroup.contains(item)

Параметры:

Имя Тип Обязательный Описание
item object Да Геометрия. Экземпляр класса геометрии.

Возвращает:

Тип Описание
Boolean Возвращает true, если геометрия содержится в группе. В противном случае - false.
Получить порядковый номер геометрии в группе
myGroup.indexOf(item)

Параметры:

Имя Тип Обязательный Описание
item object Да Геометрия. Экземпляр класса геометрии.

Возвращает:

Тип Описание
Number | null Возвращает порядковый номер геометрии в группе. Нумерация начинается с нуля. Если геометрии нет в группе, возвращает null.
Выполнить операцию для каждой геометрии в группе
myGroup.forEach(callback, context)

Параметры:

Имя Тип Обязательный Описание
callback Function Да Сallback — функция, вызываемая для каждого элемента в группе. Функция вызывается со следующими параметрами callback(geometry, index, group), где: geometry — текущая геометрия, index — порядковый номер текущей геометрии (нумерация начинается с нуля),group — объект группы myGroup.
context object Нет Контекст выполнения callback-функции. Другими словами, что будет скрываться за ключевым словом this внутри callback-функции. Если параметр не передан, по умолчанию this равен глобальному объекту window.
Получить имя группы
myGroup.getName()

Возвращает:

Тип Описание
String Возвращает имя группы, которое задается в конструкторе группы при ее создании.
Перерисовать все геометрии в группе
myGroup.redraw()