谷歌自动完成无法返回纬度和经度

Question

<script src="https://maps.googleapis.com/maps/api/js?key=KEY&libraries=places" type="text/javascript"></script>

<script>
function initialize() {

    var input = document.getElementById('searchTextField');
    var autocomplete = new google.maps.places.Autocomplete(input);

    autocomplete.addListener('place_changed', function(){
        console.log(autocomplete.getPlace());
    });
}

    google.maps.event.addDomListener(window, 'load', initialize);
</script>

<input id="searchTextField" type="text" size="50">

从我的浏览器控制台中可以看到getPlace.geometry.location.lat为空。我有什么遗漏吗？

- vandelay

Answer 1

getPlace.geometry.location.lat是一个函数，需要调用它才能获得它的值(getPlace.geometry.location.lat())。

getPlace.geometry.location.toUrlValue(6)可以给你逗号分隔的坐标。

代码片段:

function initialize() {
  var input = document.getElementById('searchTextField');
  var autocomplete = new google.maps.places.Autocomplete(input);

  autocomplete.addListener('place_changed', function() {
    console.log("lat=" + autocomplete.getPlace().geometry.location.lat());
    console.log(autocomplete.getPlace().geometry.location.toUrlValue(6));
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<input id="searchTextField" type="text" size="50">

- geocodezip

Answer 2

您需要调用单独的Google API来获取地点详情。文档位于此官方链接。

请求URL如下。

https://maps.googleapis.com/maps/api/place/details/json?place_id=ChIJN1t_tDeuEmsRUsoyG83frY4&fields=geometry,name,rating,formatted_phone_number&key=YOUR_API_KEY

- Asad Ali Choudhry