API Яндекс.Карт изучаем работу с многоугольниками.
В версии API Яндекс.Карт 1.1 появился новый тип оверлея – многоугольники.
В этой заметке я хочу познакомить Вас с тем, как можно с ними работать.
За рисование многоугольника на карте отвечает класс YMaps.Polygon.
Класс похож на YMaps.Polyline, поскольку многоугольник — это ломаная, начало и конец которой, совпадают.
Для отображения многоугольника на карте необходимо создать объект класса YMaps.Polygon и передать ему массив вершин многоугольника.
Например:
var polygon = new YMaps.Polygon([ new YMaps.GeoPoint(44.074052,56.30871), new YMaps.GeoPoint(44.074995,56.307946), new YMaps.GeoPoint(44.074842,56.307851), new YMaps.GeoPoint(44.076262,56.306717), new YMaps.GeoPoint(44.077959,56.306862), new YMaps.GeoPoint(44.078436,56.307007), new YMaps.GeoPoint(44.078606,56.306877), new YMaps.GeoPoint(44.078822,56.306223), new YMaps.GeoPoint(44.077924,56.306153), new YMaps.GeoPoint(44.077879,56.306248), new YMaps.GeoPoint(44.077429,56.306213), new YMaps.GeoPoint(44.077429,56.306083), new YMaps.GeoPoint(44.075004,56.305879), new YMaps.GeoPoint(44.074959,56.306023), new YMaps.GeoPoint(44.074339,56.305973), new YMaps.GeoPoint(44.072579,56.307417), new YMaps.GeoPoint(44.072318,56.307367), new YMaps.GeoPoint(44.072084,56.307546), new YMaps.GeoPoint(44.072731,56.307846), new YMaps.GeoPoint(44.072471,56.308071) ]); polygon.name = "ТРЦ Фантастика"; polygon.description = "Новый торговый центр"; map.addOverlay(polygon); |
Для многоугольника можно задавать стиль отображения.
По умолчанию он отображается непрозрачным, красного цвета, с заливкой 100%.
Стиль задается двумя параметрами: цвет (в системе RGB) и прозрачность.
Изменим наш пример, задав собственный стиль отображения.
var polygon = new YMaps.Polygon([ new YMaps.GeoPoint(44.074052,56.30871),
new YMaps.GeoPoint(44.074995,56.307946),
new YMaps.GeoPoint(44.074842,56.307851),
new YMaps.GeoPoint(44.076262,56.306717),
new YMaps.GeoPoint(44.077959,56.306862),
new YMaps.GeoPoint(44.078436,56.307007),
new YMaps.GeoPoint(44.078606,56.306877),
new YMaps.GeoPoint(44.078822,56.306223),
new YMaps.GeoPoint(44.077924,56.306153),
new YMaps.GeoPoint(44.077879,56.306248),
new YMaps.GeoPoint(44.077429,56.306213),
new YMaps.GeoPoint(44.077429,56.306083),
new YMaps.GeoPoint(44.075004,56.305879),
new YMaps.GeoPoint(44.074959,56.306023),
new YMaps.GeoPoint(44.074339,56.305973),
new YMaps.GeoPoint(44.072579,56.307417),
new YMaps.GeoPoint(44.072318,56.307367),
new YMaps.GeoPoint(44.072084,56.307546),
new YMaps.GeoPoint(44.072731,56.307846),
new YMaps.GeoPoint(44.072471,56.308071)
], {
style: "polygon#Example",
hasHint: 1,
hasBalloon: 1
});
polygon.name = "ТРЦ Фантастика";
polygon.description = "Новый торговый центр";
map.addOverlay(polygon); |
Две последние цифры в strokeColor задают прозрачность заливки многоугольника.
И в заключении приведу еще один пример использования многоугольников – Районы Нижннего Новгорода.
как вы определяли координаты для Районы Нижннего Новгорода., неужели это все в ручную или есть какой то способ более простого построения нежели определение координат всех точек по одной?
У меня имелся слой с районами Нижнего Новгорода в формате программы MapInfo, для примера я взял от туда координаты для границ
Встал вопрос с определением площади полигона. В Google Maps есть функция getArea()…
есть ли аналогичная функция в Яндекс Картах? Перерыд документацию, и к сожалению ничего не нашел…
К сожалению данной функции нет. Как решить данную проблему обсуждалось в клубе Яндекс.Карт
Такой вопро автору, какое максимальное число точек для полигона ты использовал в своей практике?
Около 100
Ясно.
Не в курсе, как будет работать (в плане производительности в расчете на средний комп) около 5-10 полигонов, сумарно на 700 — 1000 точек?
Просто данные для отрисовки получу не скоро, а на сколько это будет тормознуто, хотелосьбы узнать уже сейчас )