2012-11-12 139 views
0

我一直在試圖弄清楚這麼長時間,我敢肯定它正在盯着我。我使用jQuery自動完成地址郵政編碼谷歌地圖返回

由用戶輸入下面的代碼:

$(function() { 
     $("#address").autocomplete({ 
     //This bit uses the geocoder to fetch address values 
     source : function(request, response) { 
     geocoder.geocode({'address' : request.term }, 

function(results, status) { 
    response($.map(results, function(item) { 
    return { 
     label : item.formatted_address, 
     value : item.formatted_address, 
     latitude : item.geometry.location.lat(), 
     longitude : item.geometry.location.lng(), 
     streetNo : item.address_components[0].long_name, 
     streetName : item.address_components[1].long_name, 
     town : item.address_components[2].long_name, 
     province : item.address_components[4].long_name, 
      } 
     })); 
     }) 
    } 

我需要specfically提取地址組件即郵政編碼。現在我正在使用數字,但取決於輸入的地址,這些字段可能是正確的,也可能不正確。

我幾乎有同樣的問題,這個傢伙所做的:

Google Maps Geocoder: Return postal_code

這個問題的答案的問題是適當的,但我「米有問題了,當我嘗試循環,或做任何除了提取信息的方式,它已經完成在這裏腳本失敗

基於的方式jQuery的自動完成它是谷歌查詢,我可以分配「結果」的變量,然後解析它的方式爲正確的類型名字?

到目前爲止,我嘗試過的一切都失敗了,通常會導致腳本無法運行。

我在這裏越來越絕望,希望我的問題是連貫的! :P

回答

0

好的人,所以我設法弄清楚。在這裏發佈答案,以防其他人遇到此事。

已編碼的方式允許程序員使用寫在另一個答案在計算器的功能來提取準確他們正在尋找什麼類型:

More efficient way to extract address components

我使用的用戶:約翰的回答但是我會包含我的代碼,以便爲像我這樣可能很難「縮小差距」的其他「業餘愛好」程序員提供更大的整體「範圍」。

$(function() { 
    $("#address").autocomplete({ 
     //This bit uses the geocoder to fetch address values 
     source : function(request, response) { 

      geocoder.geocode({ 
       'address' : request.term 
      },function(results, status) { 
       //Here we take the response and manipulate the map 
       response($.map(results, function(item) { 
        //Function here to be called by the variables we want, essentially it loops through the array 
        //of address_components that come back from the geolocate, and loops until it finds the 'type' 
        //Entered in the "return" section below 
        function extractFromAdress(components, type){ 
         for (var i=0; i<components.length; i++) 
          for (var j=0; j<components[i].types.length; j++) 
           if (components[i].types[j]==type) return components[i].long_name; 
          return ""; 
          } 
        //Returns the variables, left of the ':' to the script 
        //Code right of the ':' is whatever we want to assign to the variable 
        return { 
         label : item.formatted_address, 
         value : item.formatted_address, 
         //Lat and Long from the geo-locate 
         latitude : item.geometry.location.lat(), 
         longitude : item.geometry.location.lng(), 
         //Typical street address values a user would input, and what a typical program would need.       
         streetNo : extractFromAdress(item.address_components, "street_number"), 
         streetName : extractFromAdress(item.address_components, "route"), 
         town : extractFromAdress(item.address_components, "administrative_area_level_3"), 
         province : extractFromAdress(item.address_components, "administrative_area_level_1"), 
         postal : extractFromAdress(item.address_components, "postal_code"), 
        } 

       })); 
      }) 
     } 

對於參考哪些類型可以從地址,檢查此鏈接:

https://developers.google.com/maps/documentation/geocoding/index#JSON

乾杯大家。

2

下面的代碼對我的作品來提取郵政編碼爲postal_code

$(function() { 
    var geocoder = new google.maps.Geocoder(); 

    $("#address").autocomplete({ 
    //This bit uses the geocoder to fetch address values 
    source : function(request, response) { 
     geocoder.geocode({'address' : request.term }, 

     function(results, status) { 
     response($.map(results, function(item) { 
      var postalCode = ""; 
      if (item.address_components) { 
      for (var i in item.address_components) { 
       if (typeof(item.address_components[i]) === "object" && item.address_components[i].types[0] == "postal_code") { 
       postalCode = item.address_components[i].long_name; 
       } 
      } 
      } 

      return { 
      label : item.formatted_address, 
      value : item.formatted_address, 
      latitude : item.geometry.location.lat(), 
      longitude : item.geometry.location.lng(), 
      streetNo : item.address_components[0].long_name, 
      streetName : item.address_components[1].long_name, 
      town : item.address_components[2].long_name, 
      province : item.address_components[4].long_name, 
      postal_code : postalCode 
      } 
     })); 
     }) 
    } 
    }); 
}); 

看到這個的jsfiddle:http://jsfiddle.net/mccannf/uzvvq/3/

+0

感謝您的答案mccannf!我實際上設法自己摔跤,我很高興看到我們都在同一頁面上。我的解決方案有點不同,請查看以上內容! –

相關問題