-
Создать блок в котором появятся карта
<div id="map"></div>
-
Подключаем библиотеку Yandex-карт и jQuery
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src='//api-maps.yandex.ru/2.1/?lang=ru_RU' type='text/javascript'></script>
-
Делаем Ajax запрос на получение координат по заданному адресу
$.getJSON('https://geocode-maps.yandex.ru/1.x/?',{
geocode:'Санкт-Петербург ул. бабушкина 3',
format :'json'
}).done(
function(data){
// data - коллекция найденных адресов
}
);
-
Далее, если нужно так же создать карту, то код будет выглядить так:
ymaps.ready(init);
var myMap1;
function init () {
function getMap(data){
coordinates_code_arr=data.response.GeoObjectCollection.featureMember['0'].GeoObject.Point.pos.split(' '); // 0 - указывает на то что мы заберем только первый найденый адрес
coordinates_code_arr.reverse(); // координаты в яндексе перевернуты, по этому их нужно поменять местами
coordinates_code=coordinates_code_arr.map(parseFloat);
myMap1 = new ymaps.Map(
'map',
{
center: coordinates_code,
zoom: 15,
type: 'yandex#map',
controls:['zoomControl']
}
);
myPlacemark = new ymaps.Placemark(coordinates_code,{
balloonContentHeader: 'Заголовок',
balloonContentBody: data.response.GeoObjectCollection.featureMember['0'].GeoObject.description,
balloonContentFooter: data.response.GeoObjectCollection.featureMember['0'].GeoObject.name,
hintContent: data.response.GeoObjectCollection.featureMember['0'].GeoObject.name
},{
preset: 'islands#dotIcon'
});
myMap1.geoObjects.add(myPlacemark);
myMap1.behaviors.disable('scrollZoom');
}
$.getJSON('https://geocode-maps.yandex.ru/1.x/?',{
geocode:'Санкт-Петербург ул. бабушкина 3',
format :'json'
}).done(
function(data){
getMap(data);
}
);
}
Результат:
пример построения карты только по адресу