#javascript #function #api #geocode
#javascript #функция #API #геокодирование
Вопрос:
function initMap() {
const map = new google.maps.Map(document.getElementById("map"), {
zoom: 15,
center: {lat: 24.149950, lng: 120.638610},
mapId: '63d22d3ae6cf15ff'
});
console.log(getCoordinates("Bouverie Street"));
}
// geocoder
function getCoordinates(address) {
const geocoder = new google.maps.Geocoder();
geocoder.geocode({address: address}, (results, status) => {
if (status === 'OK') {
return results[0].geometry.location;
} else {
alert("Geocode error: " status);
console.log(("Geocode error: " status));
}
});
}
В строке 9 я пытаюсь зарегистрировать возвращаемый объект из getCoordinates(). Однако по какой-то причине оно отображается как неопределенное. Я думаю, что функция работает так, как задумано, поскольку, если бы я добавил «console.log (results);» над оператором return, он регистрирует объект результата, как и предполагалось.
if (status === 'OK') {
return results[0].geometry.location;
}
Что я делаю не так? Заранее спасибо.
Комментарии:
1. это обратный вызов, который он не вернет
Ответ №1:
Произошла асинхронная проблема. Чтобы избавиться от этого (в данном случае вы печатаете широту и долготу), вы можете передать параметр обратного вызова при вызове getCoordinates
функции.
Здесь я собираюсь использовать приведенный ниже скрипт для примера:
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=falseamp;callback=initMap" defer></script>
Поэтому замените это своим собственным, который будет выглядеть следующим образом:
<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=YOUR_API_KEYamp;callback=initMap" defer></script>
Итак, здесь я собираюсь передать параметр обратного getCoordinates
вызова функции, который будет печатать координаты, переданные getCoordinates
таким образом:
function initMap() {
const map = new google.maps.Map(document.getElementById("map"), {
zoom: 15,
center: { lat: 24.149950, lng: 120.638610 },
mapId: '63d22d3ae6cf15ff'
});
getCoordinates("Bouverie Street", printLocation);
}
function printLocation(location) {
console.log("location");
console.log(location.lat());
console.log(location.lng());
}
// geocoder
function getCoordinates(address, myCallback) {
const geocoder = new google.maps.Geocoder();
geocoder.geocode({ address: address }, (results, status) => {
if (status === 'OK') {
myCallback(results[0].geometry.location);
} else {
console.warn = () => {}; // stop printing warnings
console.log(("Geocode error: " status));
}
});
}
#map {
height: 400px;
width: 100%;
}
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=falseamp;callback=initMap" defer></script>
<div id="map"></div>