Как инициализировать обратный геокод при загрузке страницы?
Я пытаюсь сделать обратный геокод (Google) для place_id, следуя этому google dev.guide. Но вместо события "click" для инициализации функции геокодирования я хочу выполнить функцию геокодирования при загрузке страницы. Поэтому я заменил click-eventListener следующим кодом:
document.addEventListener("DOMContentLoaded", function() {
geocodePlaceId(geocoder, map, infowindow);
});
В функции геокодирования я жестко закодировал place_id (с помощью примера):
function geocodePlaceId(geocoder, map, infowindow) {
var placeId = ChIJw2IskpfGxUcRRNxZ4A_lGWk;
geocoder.geocode({'placeId': placeId}, function(results, status) {
if (status === google.maps.GeocoderStatus.OK) {
etcetc
}
К сожалению, это не работает, то есть нет инициализированного обратного геокода. Любой совет этому очень умеренному java-программисту будет очень кстати!
1 ответ
Решение
Я получаю ошибки JavaScript с вашим кодом: Uncaught ReferenceError: ChIJw2IskpfGxUcRRNxZ4A_lGWk is not defined
, PlaceId - это строка.
Это:
var placeId = ChIJw2IskpfGxUcRRNxZ4A_lGWk;
Должно быть:
var placeId = "ChIJw2IskpfGxUcRRNxZ4A_lGWk";
фрагмент кода:
function geocodePlaceId(geocoder, map, infowindow) {
var placeId = "ChIJw2IskpfGxUcRRNxZ4A_lGWk";
geocoder.geocode({
'placeId': placeId
}, function(results, status) {
if (status === google.maps.GeocoderStatus.OK) {
map.setZoom(11);
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map
});
infowindow.setContent(results[0].formatted_address);
infowindow.open(map, marker);
} else {
window.alert('Geocoder failed due to: ' + status);
}
});
}
function initialize() {
var map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(37.4419, -122.1419),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var geocoder = new google.maps.Geocoder();
var infowindow = new google.maps.InfoWindow();
geocodePlaceId(geocoder, map, infowindow);
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>