回調回調

Question

我想把標記放在地圖上。源是一個json請求，返回城市。

我有一個返回記錄（異步）和函數（谷歌地圖API）的函數（sencha），返回特定城市（異步）和方法（谷歌地圖）的lng，lat，地圖上的標記。

結果應該是地圖上由谷歌計算的位置上的標記，並從記錄中檢索到標題。

負荷記錄

offers = App.stores.offers.load({ 
    callback: function(records, operation, success){...} 
}) 

獲取地點

geocoder = new google.maps.Geocoder(); 
geocoder.geocode(
    {'address': adress}, 
    function(results, status) {...} 
} 

，並設置標誌

marker = new google.maps.Marker({ 
    map: map, 
    position: loc, 
    title: text 
}); 

我wan't什麼做的是，加載記錄，循環每個記錄，瞭解城市的位置並在那裏放置一個標記。

同步，我會做：

records = App.stores.offers.load(); 
    for (var i=0; i < records.length; i++) { 
    setMarker(map, getLocation(records[i].data["city"]), cords[i].data["text"]); 
    } 

什麼是與異步功能把它一起的正確方法？

Answer 1

我真的不知道App.stores.offers.load函數做了什麼，但我會假設它的回調函數參數在記錄變量中包含加載結果。在這種情況下，循環遍歷回調函數中的記錄以及每個調用地理編碼，以及地理編碼的回調位置標記（沒有任何問題）。

編輯：這是未經測試，可能不是最有效的，但應該工作：

offers = App.stores.offers.load({ 
    callback: function(records, operation, success){ 
     if (success) {//or sth like this 
      var complete; 
      for (var i = 0; i < records.length; i++) { 
       complete = false; 
       geocoder.geocode({'address': records[i].adress}, 
        function(results, status) { 
        if (status == google.maps.GeocoderStatus.OK) { 
         map.setCenter(results[0].geometry.location); 
         var marker = new google.maps.Marker({ 
          map: map, 
          title: results[i].text, 
          position: results[0].geometry.location 
         }); 
        } else { 
         alert("Geocode was not successful for the following reason: " + status); 
        } 
        complete = true; 
       }); 
       while (!complete); 
      } 
     } 
    } 
}); 

Answer 2

在我的ExtJS /煎茶實現它的結束。我遇到的第二個問題是Google地圖服務的限制（我有很多配額超出例外）。所以這不完全是問題的答案。所以我將其他答案標記爲正確，因爲它更接近問題。無論如何，我最終得到的代碼可以幫助某人。

App.stores.offers = new Ext.data.Store({ 
model: 'Offer', 
(...) 

listeners: { 
    load: function(store, records, success){ 
    this.addEvents("refresh_locations", "locations_updated"); 
    for (var i=0; i < store.data.length; i++) { 
    store.fireEvent("refresh_locations", store , store.getAt(i), "load"); 
    } 
}, 
refresh_locations: function(store, record, method){ 
    if (record.get("location") == null || record.get("location") == ""){ 
    Ext.Ajax.request({ 
     url: 'api/partner2sport/find_location', 
     params: { 
     "city" : record.get("place") 
     }, 
     success: function(response, options) { 
     db_check = Ext.decode(response.responseText)["success"]; 
     if (db_check){ 
      var latlngStr = Ext.decode(response.responseText)["location"].replace(/\(|\)/g,"").split(",",2) 
      var lat = parseFloat(latlngStr[0]) - (Math.random()/100); 
      var lng = parseFloat(latlngStr[1]) - (Math.random()/100); 
      var latlng = new google.maps.LatLng(lat, lng); 
      record.set("location", latlng); 
     }else{ 
      geocoder = new google.maps.Geocoder(); 
      geocoder.geocode(
      { 
       'address': record.get("place") 
      }, 
      function(results, status) { 
       if (status == google.maps.GeocoderStatus.OK) {    
       record.set("location", results[0].geometry.location); 
       Ext.Ajax.request({ 
        url: 'api/partner2sport/set_location', 
        params: { 
        "city" : record.get("place"), 
        "location": record.get("location") 
        } 
       }); 
       } 
      } 
     ); 
     } 
     }, 
     failure: function(response, options) { 
     console.log("bad request"); 
     } 
    }); 
    } 
}, 

（...）