Клуб API Карт

Как задать собственную картинку для отображения меток в коллекции?

Пост в архиве.

Всем привет! Посдкажите, пожалуйста, как задать для всей коллекции объектов собственную картинку? Не понимаю. где в конструкторе коллекции это прописать.

 

Создаю коллекцию 

myCollection = new ymaps.GeoObjectCollection();

 

Куда нужно вставить данные строчки?:

iconImageHref: '/images/icon-orange.png', // картинка иконки

iconImageSize: [22, 28], // размеры картинки

iconImageOffset: [-11, -30], // смещение картинки

9 комментариев

судя по документации второй параметр

Здорово. Я видел документацию.

 

Я делал так:

myCollection = new ymaps.GeoObjectCollection({},{

iconImageHref: '/images/icon-orange.png', // картинка иконки

iconImageSize: [22, 28], // размеры картинки

iconImageOffset: [-11, -30], // смещение картинки

});

Но это не дало никаких результатов. У меня есть предположения, что я не до кнца понимаю как в яндексных методах описываются параметры. Подскажите, пожалуйста, как правильно это сделать.

у меня все 3 варианта выдают одинаковый результат - лого яндекса на карте

 

 

        myCollection = new ymaps.GeoObjectCollection(null, {            iconImageHref: 'http://yandex.st/lego/_/X31pO5JJJKEifJ7sfvuf3mGeD_8.png',            iconImageSize: [95, 37], // размеры картинки            iconImageOffset: [-11, -30] // смещение картинки        });                                                                                                                                                                                                                                       

 

 

        myCollection = new ymaps.GeoObjectCollection();        myCollection.options.set({            iconImageHref: 'http://yandex.st/lego/_/X31pO5JJJKEifJ7sfvuf3mGeD_8.png',            iconImageSize: [95, 37], // размеры картинки            iconImageOffset: [-11, -30] // смещение картинки        });

 

 

 

        myCollection = new ymaps.GeoObjectCollection();        myCollection.options            .set('iconImageHref', 'http://yandex.st/lego/_/X31pO5JJJKEifJ7sfvuf3mGeD_8.png')            .set('iconImageSize', [95, 37])            .set('iconImageOffset', [-11, -30])

 

Дмитрий, вы совершенно правы! Ваша помощь мне очень помогла, и спасла меня от быдлокодинга - я раньше создавал коллекцию из меток, с одинаковыми свойствами, и задавал эти свойства в конструкторе каждой метки. И меня раньше это вполне устраивало, пока я не наткнулся на необходимость создавать коллекцию следующим образом: 

      $('#search-form').submit(function () {

                var search_query = $('#search-input-text').val();

                ymaps.geocode(search_query, {results: 100}).then(function (res) {

                    myCollection.removeAll();

                    myCollection = res.geoObjects;

                    myMap.geoObjects.add(myCollection);

    myMap.setBounds(myCollection.getBounds(),{checkZoomRange: true});

                });                return false;        });

 

Здесь мне пришлось искать способ, как задавать свойства для всей коллекции меток. Самое интересное, что данный способ задания свойств у меня сработал только таким путем:

 

 

        $('#search-form').submit(function () {                var search_query = $('#search-input-text').val();                ymaps.geocode(search_query, {results: 100}).then(function (res) {                    myCollection.removeAll();                    myCollection = res.geoObjects;         myCollection.options.set({           iconImageHref: 'http://yandex.st/lego/_/X31pO5JJJKEifJ7sfvuf3mGeD_8.png',           iconImageSize: [95, 37], // размеры картинки           iconImageOffset: [-11, -30] // смещение картинки          });                    myMap.geoObjects.add(myCollection);   myMap.setBounds(myCollection.getBounds(),{checkZoomRange: true});                });                return false;        });

А когда я задавал свойства как параметр в конструкторе myCollection, то не срабатывало. Хотя с другими уколлекциями, где я вручную создавал метки, прокатывало.

 

Пожалуйста, для того мы здесь и есть =)

У Вас есть одна логическая ошибка в коде, - Вам не нужно перезаписывать ссылку на коллекцию,

и тогда отпадает необходимость каждый раз устанавливать ей опции и добавлять коллекцию на карту и загружать работой сборщик мусора =)

 

Итак, до обработчика submit:

1. Создаешь myCollection с нужными опциями один раз.

2. Добавляешь myCollection на карту один раз.

 

var myCollection = new ymaps.GeoObjectCollection(null, options);
myMap.geoObjects.add(myCollection);
 $('#search-form').submit(function () {    ...});

 

 

Внутри обработчика submit:

1. удаляешь всё из myCollection.

2. перекладываешь все из ответа геокодера в myCollection с помощью метода each или итератора у res.geoObjects (да, это тоже коллекция)

 

$('#search-form').submit(function () {
var search_query = $('#search-input-text').val();
ymaps.geocode(search_query, {results: 100}).then(function (res) {
myCollection.removeAll();
res.geoObjects.each(function (geoObject) {    myCollection.add(geoObject);});

myMap.setBounds(myCollection.getBounds(),{checkZoomRange: true});
});
return false;
});

 

 всё, конец фильма =)

 

Дмитрий, здравствуйте.

Только сейчас прочитал ваше сообщение. Последовал вашему совету и сделал именно так, как вы написали. Спасибо!

Ситуация: у коллекции задана иконка(iconImageHref), у placemark внутри колллекции задана своя иконка, но она не "перебивает" ту, что в коллекции. Это бага или фича? :)

это фича. так и должно быть

Андрей Веб
28 января 2016, 03:45

А как оформить именованый стиль, и дальше работать с ним по названию. В предыдущей версии АПИ это было можно сделать.