Во время создания одного проекта связанного с арендой недвижимости возникла маленькая задачка с подключением Google Maps API. Владелец сайта создавал карточки товара (квартир) и ему необходим был вывод месторасположения квартиры на карте гугл, в одной из вкладок.
Подключив google api и перечитав их мануал я так и не нашел как же задать для вывода не координаты а именно адрес местоположения.
Давайте подготовим наш документ:
Отлично. Каркас для вывода карты у нас есть. Далее напишем функцию инициализации карты и будем запускать ее при окончании загрузки страницы.
$(document).ready(function(){ var geocoder; var map; var address = $('#address').val(); function initialize() { geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(-34.397, 150.644); var myOptions = { zoom: 16, center: latlng, mapTypeControl: true, mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU }, navigationControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); if (geocoder) { geocoder.geocode({ 'address': address }, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { if (status != google.maps.GeocoderStatus.ZERO_RESULTS) { map.setCenter(results[0].geometry.location); var infowindow = new google.maps.InfoWindow({ content: '' + address + '', size: new google.maps.Size(150, 50) }); var marker = new google.maps.Marker({ position: results[0].geometry.location, map: map, title: address }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map, marker); }); } else { alert("No results found"); } } else { alert("Geocode was not successful for the following reason: " + status); } }); } } google.maps.event.addDomListener(window, 'load', initialize); });
Откроем нашу страничку и увидем отмеченную маркером карту google. И не нужно открывать ее в браузере получать код для размещения на сайте и вставлять в блок.
надеюсь кому нибудь пригодится данная статья. Спасибо;)
Denis Creative
Когда-то подобное делал с напарником, сейчас уже не вспомнил как и где это было. Повезло, что нашел эту статью! Все четко и все работает!) Спасибо большое! Если не против, то с обратной ссылкой на Ваш сайт размещу код на своем сайте.
Евгений П.
Пользуйтесь на здоровье. С обратной ссылкой конечно размещайте;)