Добавление геообъектов в коллекцию
Геообъекты можно объединять в коллекции. Вы можете создавать коллекции для групповых операций над геообъектами. Например, можно подписываться на события объектов или задавать им опции.
index.html
geo_object_collection.js
<!DOCTYPE html>
<html>
<head>
<title>Добавление геообъектов в коллекцию</title>
<meta
http-equiv="Content-Type"
content="text/html; charset=utf-8"
/>
<!--
Укажите свой API-ключ. Тестовый ключ НЕ БУДЕТ работать на других сайтах.
Получить ключ можно в Кабинете разработчика: https://developer.tech.yandex.ru/keys/
-->
<script
src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<ваш API-ключ>"
type="text/javascript"
></script>
<script
src="geo_object_collection.js"
type="text/javascript"
></script>
<style>
html,
body,
#map {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</html>
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map(
"map",
{
center: [55.73, 37.75],
zoom: 9,
},
{
searchControlProvider: "yandex#search",
}
),
yellowCollection = new ymaps.GeoObjectCollection(null, {
preset: "islands#yellowIcon",
}),
blueCollection = new ymaps.GeoObjectCollection(null, {
preset: "islands#blueIcon",
}),
yellowCoords = [
[55.73, 37.75],
[55.81, 37.75],
],
blueCoords = [
[55.73, 37.65],
[55.81, 37.65],
];
for (var i = 0, l = yellowCoords.length; i < l; i++) {
yellowCollection.add(new ymaps.Placemark(yellowCoords[i]));
}
for (var i = 0, l = blueCoords.length; i < l; i++) {
blueCollection.add(new ymaps.Placemark(blueCoords[i]));
}
myMap.geoObjects.add(yellowCollection).add(blueCollection);
// Через коллекции можно подписываться на события дочерних элементов.
yellowCollection.events.add("click", function () {
alert("Кликнули по желтой метке");
});
blueCollection.events.add("click", function () {
alert("Кликнули по синей метке");
});
// Через коллекции можно задавать опции дочерним элементам.
blueCollection.options.set("preset", "islands#blueDotIcon");
}