谷歌放置API不返回一些地方的邮政编码

Question

我有一个表格，可以从用户收集位置信息。我使用Google放置api来自动完成位置信息。它效果很好。尽管有一些地方（例如我的工作场所是建筑物），但一切都很好，但Google不会为此返回邮政编码。

我跟着这个example来自Google地址自动填充。它也不会为我的工作单位返回邮政编码。所以我不完全确定我做错了什么。

下面是我的代码：

HTML

<div id="location-autocomplete" style="display: none;"> 
     <div class="half-formfield"> 
      @Html.LabelFor(x => x.Address) 
      @Html.TextBoxFor(x => x.Address, new { @class = "two-third-field", id = "street_number", required = "required" }) 
     </div> 
     <div> 
      @Html.LabelFor(x => x.UnitNumber, new { value = "Unit Number" }) 
      @Html.TextBoxFor(x => x.UnitNumber, new { @class = "one-third-field" }) 
     </div> 
     <div class="half-formfield"> 
      @Html.LabelFor(x => x.City) 
      @Html.TextBoxFor(x => x.City, new { @class = "half-field", required = "required", id = "locality" }) 
     </div> 
     <div> 
      @Html.LabelFor(x => x.ProvinceOrState) 
      @Html.TextBoxFor(x => x.ProvinceOrState, new { @class = "half-field", required = "required", id = "administrative_area_level_1" }) 
     </div> 
     <div class="half-formfield"> 
      @Html.LabelFor(x => x.ZipOrPostalCode) 
      @Html.TextBoxFor(x => x.ZipOrPostalCode, new { @class = "half-field", required = "required", id = "postal_code" }) 
     </div> 
     <div> 
      @Html.LabelFor(x => x.Country) 
      @Html.TextBoxFor(x => x.Country, new { @class = "half-field", required = "required", id = "country" }) 
     </div> 
     <input type="button" value="Clear Address" onclick="clearAddress()" id="clear-btn" class="service-form-btn"/> 

JS

var placeSearch, autocomplete; 
var componentForm = { 
    street_number: 'short_name', 
    route: 'long_name', 
    locality: 'long_name', 
    administrative_area_level_1: 'short_name', 
    country: 'long_name', 
    postal_code: 'short_name' 
}; 

function initialize() { 
    // Create the autocomplete object, restricting the search 
    // to geographical location types. 
    autocomplete = new google.maps.places.Autocomplete(
     /** @type {HTMLInputElement} */(document.getElementById('autocomplete')), 
     { types: ['geocode'] }); 
    // When the user selects an address from the dropdown, 
    // populate the address fields in the form. 
    google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     fillInAddress(); 
     showAddressComponent(); 
     setTimeout(hideAddressSearch, 800); 
    }); 

} 

function fillInAddress() { 
    // Get the place details from the autocomplete object. 
    var place = autocomplete.getPlace(); 

    for (var component in componentForm) { 
     if (component != "route") { 
      document.getElementById(component).value = ''; 
      document.getElementById(component).disabled = false; 
     } 
    } 
    // Get each component of the address from the place details 
    // and fill the corresponding field on the form. 
    for (var i = 0; i < place.address_components.length; i++) { 
     var addressType = place.address_components[i].types[0]; 
     if (componentForm[addressType]) { 
      var val = place.address_components[i][componentForm[addressType]]; 
      console.log(val); 
      if (addressType != "route") document.getElementById(addressType).value = val; 
      else if (addressType == "route") document.getElementById("street_number").value = document.getElementById("street_number").value + " " + val; 
     } 
    } 
} 

// Bias the autocomplete object to the user's geographical location, 
// as supplied by the browser's 'navigator.geolocation' object. 
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)); 
     }); 
    } 
} 

截图

我不知道这是一个错误或者干脆谷歌不知道建筑物的邮政编码。在那种情况下，是否有任何解决此问题的方法？

在此先感谢。

Answer 1

这个地址有一个邮编，但只有一部分（我想它被称为FSA代码）。

的功能并没有认识到这一点的一部分，因为该地址的返回类型数组是：

["postal_code_prefix", "postal_code"] 

...但功能只检查类型数组的第一个项目。

可能的解决办法：

function fillInAddress() { 
    // Get the place details from the autocomplete object. 
    var place = autocomplete.getPlace(); 

    for (var component in componentForm) { 
    document.getElementById(component).value = ''; 
    document.getElementById(component).disabled = false; 
    } 

    // Get each component of the address from the place details 
    // and fill the corresponding field on the form. 
    for (var i = 0; i < place.address_components.length; i++) { 
    var addressTypes = place.address_components[i].types,addressType,val; 
    for(var j=0;j<addressTypes.length;++j){ 

     addressType=addressTypes[j]; 

     if (componentForm[addressType]) { 
     val = place.address_components[i][componentForm[addressType]]; 
     document.getElementById(addressType).value = val; 
     break; 
     } 
    } 

    } 
} 

Answer 2

var location = place.geometry.location; 
var lat = location.lat(); 
var lng = location.lng(); 


var latlng = {lat: lat, lng: lng}; 
      geocoder.geocode({'location': latlng}, function(results, status) { 
         if (status == google.maps.GeocoderStatus.OK) { 

          if (results[0]) { 

          for (var i = 0; i < results[0].address_components.length; i++) { 
           var types = results[0].address_components[i].types; 

           for (var typeIdx = 0; typeIdx < types.length; typeIdx++) { 
            if (types[typeIdx] == 'postal_code') { 
             //console.log(results[0].address_components[i].long_name); 

             var pincode = results[0].address_components[i].short_name; 
             alert('pin'+pincode); 

            } 
           } 
          } 

          $('#pac-input2').val(results[0].formatted_address); 
          infowindow.setContent(results[0].formatted_address); 
          //infowindow.open(map, marker); 
          } 
         } 

      });