Клуб API Карт

Простой пример кластеризатора

SergVolk
21 августа 2013, 12:47

Добрый день!

Я никак не могу добиться кластеризации меток. Пример в песочнице работает, но изобилует разными украшательствами и скорее показывает визуальное отображение, нежили простой код.

Руководство разработчика (объекты на карте - кластеризация) даёт понятный и простой пример. Но у меня не получается заставить его работать. Его первая часть создаёт точки и работает:

 

var coords = [[56.023, 36.988], [56.025, 36.981], [56.020, 36.981], [
    56.021, 36.983], [56.027, 36.987]]
var myCollection = new ymaps.GeoObjectCollection();
for (var i = 0; i < coords.length; i++) {
    myCollection.add(new ymaps.Placemark(coords[i]));
}
myMap.geoObjects.add(myCollection);

 

Вторую часть прикрутить не удаётся.

 

var myGeoObjects = [];
for (var i = 0; i < coords.length; i++) {
    myGeoObjects[i] = new ymaps.GeoObject({
        geometry: {
            type: "Point",
            coordinates: coords[i]
        }
    });
}
var myClusterer = new ymaps.Clusterer();
myClusterer.add(myGeoObjects);
myMap.geoObjects.add(myClusterer);

 

Я попробывал разные варианты, но в чём-то ошибся. Циклом метки должны добавляться вместо myCollection в myClusterer? Если не сложно подскажите рабочий вариант на этом примере.

Спасибо!

9 комментариев
Подписаться на комментарии к посту

var coords = [...],

    placemarks = [];

for (var i = 0, l = coords.length; i < l; i++) {

    placemarks[i] = new ymaps.Placemark(coords[i]);

}

var myClusterer = new ymaps.Clusterer();

myClusterer.add(placemarks);

map.geoObjects.add(myClusterer);

Вроде как всё правильно, но в песочнице не работает...

Делаю на основе 1го примера песочницы "Карта - создание и удаление". Вот весь текст:

 

var myMap;

 

// Дождёмся загрузки API и готовности DOM.

ymaps.ready(init);

 

function init () {

    // Создание экземпляра карты и его привязка к контейнеру с

    // заданным id ("map").

    myMap = new ymaps.Map('map', {

        // При инициализации карты обязательно нужно указать

        // её центр и коэффициент масштабирования.

        center:[56.023, 36.988], // Москва

        zoom:10

    });

    

    

var coords = [

    [56.023, 36.988],

    [56.025, 36.981],

    [56.020, 36.981],

    [56.021, 36.983],

    [56.027, 36.987]

],

    

 

 placemarks = [];

 

for (var i = 0, l = coords.length; i < l; i++) {

 

    placemarks[i] = new ymaps.Placemark(coords[i]);

 

}

 

var myClusterer = new ymaps.Clusterer();

 

myClusterer.add(placemarks);

 

map.geoObjects.add(myClusterer);

    

    

    document.getElementById('destroyButton').onclick = function () {

        // Для уничтожения используется метод destroy.

        myMap.destroy();

    };

}

Карта есть - точек нет...

В этом примере поключен пакет package.standard, в нем нет кластеризатора.

Подключите дополнительно пакет package.clusters.

Спасибо большое! Уже одну ошибку выловили. Попробывал на примере песочница (Геобъекты - Кластеризация меток). Тоже не работает. Залил на сайт - неработает...

 

    Примеры. Использование кластеризатора

   

   

   

 

 

 

Посмотрите в консоли разработчика - там же все видно, у вас переменная myMap, а вы пишете в map

Спасибо большое! Всегда какая-то ерунда вылезает. А в чём Вы смотреие консоль разработчика?

В моём блокноте его нет :-(...

Спасибо! Этого не хватало.

Ещё один маленький вопросик про clusterer. В него можно добавлять точки и метки.

clusterer.add(points);

Clusterer.add(placemarks);

А мажно ли добавить коллекции?

Clusterer.add(myCollection);

У меня не получалось...

Есть где-то 5 коллекций. Можно в принципе их записать в var в разные массивы и по очереди добавить в Clusterer. Но было бы удобнее что-то типа:

Clusterer.add(myCollection1); Clusterer.add(myCollection2); .... Clusterer.add(myCollectionN);