Клуб API Карт

Клуб API Карт

iconLayout не могу применить шаблон [Решено]

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

Здравствуйте. Возникла проблема с изменением шаблона метки, почему-то не отображается картинка. Что я делаю не так? 
Картинка существует по указаному пути, пробовал через iconContentLayout. А с iconLayout какая-то беда, может я что-то "перекрываю"?

 function createMetka(id, x, y, deg, layout) { // Функция создания метки

    var coord = new Array();

    coord.push(x);

    coord.push(y);

    myPlacemark[id] = new ymaps.Placemark(coord, { // Создается метка со всеми параметрами

        id: id, // ID метки

        deg: deg,//курс

        active: 0//активная/неактивная

    }, {

        hideIconOnBalloonOpen: true,

        iconLayout: ymaps.templateLayoutFactory.createClass(

            '<img  src="../img/icons/arrow2.png" > '

        )

    });

    myPlacemark[id].events.add('click', activeObject); // Событие при открытии метки*/

    myCollection.add(myPlacemark[id]);

    myMap.setBounds(myCollection.getBounds(), {zoomMargin: [50, 0, 180, 75], duration: 400, checkZoomRange: true});

    $('.load_layout').css('display', 'none');

}

8 комментариев
Авторизуйтесь, чтобы оставить комментарий
mari-na-bzzz
28 января 2016, 00:34

Какая версия апи? 2.0 или 2.1?

Вы не могли бы дать ссылку на страницу?

iytin-ne
28 января 2016, 00:34

Здравствуйте Марина. К сожалению, у меня нет возможности скинуть ссылку на проект =(   Может подскажете в какую сторону копать? Использую версию 2.0. Я думаю, может, что-то в настройках колекции (в которую я добавляю все эти метки), перекрывает этот шаблон, и что наибольше меня удивило что iconContentLayout работает нормально а вот iconLayout - нет,и ошибок никаких консоль не выдает.

mari-na-bzzz
28 января 2016, 00:34

Я открыла песочницу на примере http://api.yandex.ru/maps/jsbox/placemark и заменила часть кода вот на такой

 

myGeoObject = new ymaps.GeoObject({

            // Описание геометрии.

            geometry: {

                type: "Point",

                coordinates: [55.8, 37.8]

            },

            // Свойства.

            properties: {

                // Контент метки.

                iconContent: 'Метка',

                balloonContent: 'Меня можно перемещать'

            }

        }, {

            // Опции.

            // Иконка метки будет растягиваться под размер ее содержимого.

            preset: 'twirl#redStretchyIcon',

            // Метку можно перемещать.

            draggable: true,

            iconLayout: ymaps.templateLayoutFactory.createClass('')

        }),

 

Метка отображается

iytin-ne
28 января 2016, 00:34

Спасибоо!!!:-)

mari-na-bzzz
28 января 2016, 00:34

=)

iytin-ne
28 января 2016, 00:34

возник мелкий вопрос по поводу примера, тот что Вы написали выше,  я в песочницу вставил такой код

 

ymaps.ready(init);

 

function init () { 

    var myMap = new ymaps.Map("map", {

            center: [55.76, 37.64],

            zoom: 10

        });

             // Кнопка изменения масштаба.

        myMap.controls

        .add('zoomControl', { left: 5, top: 5 });

 

    // Также в метод add можно передать экземпляр кла

 

        myGeoObject = new ymaps.GeoObject({

 

            // Описание геометрии.

 

            geometry: {

 

                type: "Point",

 

                coordinates: [55.8, 37.8]

 

            },

 

            // Свойства.

 

            properties: {

 

                // Контент метки.

 

                iconContent: 'Метка',

 

                balloonContent: 'Меня можно перемещать'

 

            }

 

        }, {

 

            // Опции.

 

            // Иконка метки будет растягиваться под размер ее содержимого.

 

            preset: 'twirl#redStretchyIcon',

 

            // Метку можно перемещать.

 

            draggable: true,

 

            iconLayout: ymaps.templateLayoutFactory.createClass('')

 

        });

    myMap.geoObjects

        .add(myGeoObject);

}

 

и получается что когда я зумирую карту метка смещается со своего места, тоесть не соответствует тем координатам где она должна быть. можно этот эфект как-то убрать?
mari-na-bzzz
28 января 2016, 00:34

Это потому что у вас картинка неверно спозиционирована относительно точки привязки метки, надо задать картинке отступы с помощью css

А почему вам не подойдет решение, которое указано в примере? http://api.yandex.ru/maps/jsbox/placemark

использовать стандартный макет и задавать ему просто ссылку на картинку

iytin-ne
28 января 2016, 00:34

Здравствуйте Марина. У меня дальнейшая задача, динамически поворачивать "стрелочки" (метки) на определенный градус, и я подумал что так будет проще это реализовать. Насчет css понял, сейчас попробую реализовать.