Добавление на карту объектов с разной геометрией

Open in CodeSandbox

ObjectManager - класс, позволяющий добавить на карту большое количество объектов без необходимости создавать и добавлять на карту метки по отдельности.

Объекты, добавленные в ObjectManager, располагаются в коллекции ObjectManager.objects. Визуальным отображением меток и кластеров являются объекты, реализующие интерфейс IOverlay. Оверлеи помещаются в коллекции ObjectManager.objects.overlays и ObjectManager.clusters.overlays соответственно.

ObjectManager принимает описания меток в JSON формате. Метки могут кластеризоваться или показываться как есть. Если вы не используете кластеризацию, то метки будут показаны только в видимой области карты. Поскольку объекты хранятся в менеджере в виде JSON описаний и их визуальное отображение создается только по необходимости, этот способ добавления точек на карту работает быстрее, чем добавление меток на карту напрямую или через кластеризатор. 

<!DOCTYPE html>
<html lang="ru">
    <head>
        <title>Добавление на карту объектов с разной геометрией</title>
        <meta charset="utf-8" />

        <style>
            html,
            body,
            .map {
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }
        </style>

        <script src="https://yastatic.net/jquery/2.2.3/jquery.min.js"></script>
        <!--
        Укажите свой API-ключ. Тестовый ключ НЕ БУДЕТ работать на других сайтах.
        Получить ключ можно в Кабинете разработчика: https://developer.tech.yandex.ru/keys/
    -->
        <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;apikey=<ваш API-ключ>"></script>
        <script src="object_manager_spatial.js"></script>
    </head>
    <body>
        <div id="map" class="map"></div>
    </body>
</html>

ymaps.ready(function () {
    var map = new ymaps.Map("map", {
            center: [55.79, 37.64],
            zoom: 10,
            controls: ["zoomControl"],
        }),
        objectManager = new ymaps.ObjectManager();

    // Загружаем GeoJSON файл с описанием объектов.
    $.getJSON("data.json").done(function (geoJson) {
        // Добавляем описание объектов в формате JSON в менеджер объектов.
        objectManager.add(geoJson);
        // Добавляем объекты на карту.
        map.geoObjects.add(objectManager);
    });
});