Делаю карту, рядом с которой будет выводиться список адресов. При нажатии на один из них карта переезжает к локации. Делаю по API Яндекс с
этой страницы. Вот мой код JS:
// Map
ymaps.ready(init);
function init() {
// Locations
let items = [
{
center: [50.426472, 30.563022],
name: 'ТЦ «7 Континент»',
address: 'ул. Магомеда Ярагского, 30',
background: 'blue'
},
{
center: [50.45351, 30.516489],
name: 'DonutsDay',
address: 'г. Махачкала, ул. Лаптиева 49а',
background: 'red'
},
{
center: [50.454433, 30.529874],
name: 'DonutsDay',
address: 'г. Махачкала, ул. Дзержинского 8',
background: 'yellow'
}
]
let myMap = new ymaps.Map('map', {
center: [50.443705, 30.530946],
zoom: 14
}, {
searchControlProvider: 'yandex#search'
}),
menu = $('.contactsMap__cards');
for ( let j = 0, m = items.length; j < m; j++ ) {
createMenu(items[j]);
}
function createMenu (items) {
let card = $('<div class="contactsMapCard contactsMapCard_background_' + items.background + '"><div class="contactsMapCard__title">' + items.name + '</div><div class="contactsMapCard__address">' + items.address + '</div></div>'),
placemark = new ymaps.Placemark(items.center, { balloonContent: items.name });
card
.appendTo(menu)
.find('.contactsMapCard')
.bind('click', function () {
if (!placemark.balloon.isOpen()) {
placemark.balloon.open();
} else {
placemark.balloon.close();
}
return false;
});
}
};
Список адресов рядом с картой выводится,
но я так и не смог сделать, чтобы на самой карте выводились соответствующие локации.
В примере от Яндекса, они используют коллекции для группировки локаций в списке, но мне они не нужны, поэтому я подредактировал код из их примера, но есть вот такая проблема.