Для добавления Яндекс.Карт с API версии 2.0 не требуется регистрироваться и создавать ключ авторизации. Новые карты быстрее загружаются, имеют гораздо более подробные схемы для малых городов и обладают другими преимуществами.
Для создания карт можно использовать собственный код или простую функцию mapFromList() из библиотеки libhack.js:
1 2 3 4 | mapFromList([ {name:'Коля & Боря', address:'Москва, Кулакова ул., 20'}, {name:'Аркадий Петрович и Ко', address:'Санкт-Петербург, Малый пр. В.О., 48, корп.2, лит. А'}]); |
В данном примере функции передается список объектов, у каждого из которых есть параметры name (название) и address (полный почтовый адрес). Из этих данных функция построит внутри элемента
1 | <div id="map"></div> |
карту с двумя метками, как показано ниже:
Таким образом, порядок действий для создания карты:
1 2 | <script src="/frontend/Gui/kb/lib/jquery-2.0.3.js"></script><script src="https://xevian.signica.ru/lib/goodies/libhack.js"></script> |
1 2 3 | <div id="map"></div><h1>{title_}</h1><span class="address">{address}</span> |
1 2 | var list = [ { name:$('h1').text(), address:$('.address').text() } ];mapFromList(list); |
1 | #map { width:100%; height:480px; } |
Функция mapFromList() поддерживает и второй аргумент — icon, в котором можно передать название типа значков из списка.1
Для тонкой настройки процесса создания карт можно использовать более общую функцию createMap() из этой же библиотеки. Помимо вида значков, она позволяет изменить id контейнера, версию API и список элементов управления на карте, однако может меняться в будущем.
// карта ресторанов) из выведенных в листинге данных.// модальное окно "схема проезда") во всплывающее окно по ссылке Схема проезда.
// карта организаций) таким же образом, но выбран нерастяжимый тип значков, поэтому названия в них не выводятся.