Google maps api 3 如果用户未选择地点,如何对地点进行地理编码自动完成输入

Google maps api 3 如果用户未选择地点,如何对地点进行地理编码自动完成输入,google-maps-api-3,google-places,Google Maps Api 3,Google Places,我一直在尝试将谷歌地图中的Places Autocomplete合并到一个地址字段中,但对输入进行地理编码时遇到了问题。自动完成是完美的,我的问题是,如果用户在何处键入他们的地址,或zipcode,或其他,然后在没有从下拉列表中选择地址的情况下从地址字段中单击或单击,则不会触发place_change事件,地址将永远不会进行地理编码和存储 代码如下: var placeSearch,autocomplete; var latlng = { 'lat': 'lat', 'lng': 'ln

我一直在尝试将谷歌地图中的Places Autocomplete合并到一个地址字段中,但对输入进行地理编码时遇到了问题。自动完成是完美的,我的问题是,如果用户在何处键入他们的地址,或zipcode,或其他,然后在没有从下拉列表中选择地址的情况下从地址字段中单击或单击,则不会触发place_change事件,地址将永远不会进行地理编码和存储

代码如下:

var placeSearch,autocomplete;
var latlng = {
  'lat': 'lat',
  'lng': 'lng'
};
function initialize() {

$(document).ready(function(){
    $("#userLocation").blur(function(e){
        google.maps.event.clearInstanceListeners(autocomplete);
        var geocoder = new google.maps.Geocoder();
        geocoder.geocode({ 'address': document.getElementById('autocomplete') }, function(results) {
            //  var latlng = results[0].geometry.location;
            window.lat = results[0].geometry.location.k;
            window.lng = results[0].geometry.location.B
            //  console.log(latlng);
            //  console.log(location_type);
            console.log(lat);
            console.log(lng);
        });
    });
});

var options = {
    types: ['geocode']
};
autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'), options);
google.maps.event.addListener(autocomplete, 'place_changed', function() {
   fillInPlaceLatLng();
});
}
function fillInPlaceLatLng() {
  var place = autocomplete.getPlace();
  var lat = autocomplete.getPlace().geometry.location.lat();
  var lng = autocomplete.getPlace().geometry.location.lng();
  console.log(place);
  console.log(lat);
  console.log(lng);

  document.getElementById('lat').value = lat;
  document.getElementById('lng').value = lng;

  for (var j = 0; j < place.address_components.length; j++) {
    var att = place.address_components[j].types[0];
    if (latlng[att]) {
        var val = place.address_components[j][latlng[att]];
        document.getElementById(att).value = val;
    }
  }
}
function geolocate() {

  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
        var geolocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
        autocomplete.setBounds(new google.maps.LatLngBounds(geolocation, geolocation));
  });
  } else {
      var autocompleteResult = document.getElementById('autocomplete').value;
      console.log(autocompleteResult);
      var geocoder = new google.maps.Geocoder();

  }
}

在运行自动完成代码之前,我可以通过访问Maps API geocoder来解决这个问题

jQuery("#autocomplete").blur(function(e){
console.log(e);
console.log(this.value);
var geocoder = new google.maps.Geocoder();
    geocoder.geocode({ 'address': this.value }, function(results) {
       var lat = results[0].geometry.location.lat();
       var lng = results[0].geometry.location.lng();
        document.getElementById('lat').value = lat;
        document.getElementById('lng').value = lng;
    });
});

这样,如果用户通过“自动完成”选择一个位置,两组坐标都将返回,但“自动完成”中正确的坐标将最后返回并使用。如果用户在字段外单击或单击,则只返回第一组

您不应该依赖.k或.b从LatLng对象获取纬度或经度。而不是使用结果[0].geometry.lat和结果[0].geometry.lng来获取纬度和经度。多亏了这一点,您在不久的将来避免了意外的问题。@AlexB请详细说明一下。我的代码前几天还在工作,现在无论我使用.k/.b还是.lat/.lngUpdate,我都无法让它工作:代码再次使用结果[0].geometry.lat和结果[0].geometry.lng这就是为什么您总是必须在LatLng对象上使用.lat et.lng的原因,如下所述: