回调高于回调
Callbacks over Callbacks
我想在地图上放上标记。来源是一个json请求,返回城市。
我有一个函数(sencha),返回记录(异步)和一个函数(谷歌地图api),返回lng, lat为特定的城市(异步)和一个方法(谷歌地图),把标记在地图上。
结果应该是google计算的地图位置上的一个标记,并从记录中检索标题。
加载记录
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
});
我想做的是,加载记录,循环遍历每条记录,找出城市的位置,并在那里放一个标记。
同步I将做:
records = App.stores.offers.load();
for (var i=0; i < records.length; i++) {
setMarker( map, getLocation(records[i].data["city"]), cords[i].data["text"]);
}
把它和异步函数放在一起的正确方法是什么?
我真的不知道App.stores.offers.load函数到底做什么,但我假设它的回调函数参数包含记录变量中的加载结果。在这种情况下,循环回调函数内部的记录,并为每个调用geocode,以及geocode的回调位置标记(这没有错)。
编辑:这是未经测试的,可能不是最有效的,但应该工作:
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);
}
}
}
});
最后我用extjs/sencha实现了它。我遇到的第二个问题是谷歌地图服务的限制(我有很多配额超过例外)。所以这并不是问题的答案。所以我把另一个答案标记为正确,因为它更接近问题。这里是我最后的代码,希望它能帮助到别人。
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");
}
});
}
},
(…)
相关文章:
- AngularJS:我可以跳过函数参数回调吗
- 要求未定义JS回调参数
- MeteorJS:在带有回调的vzaar api上正确使用wrapAsync
- 自引用回调
- 测试Angular Service解决错误回调中的promise
- 如何将一个JavaScript函数回调为多个函数
- JavaScript回调函数
- 用于回调的javascript参数
- 将json回调数据转换为日期
- 承诺在非节点式回调上使用Bluebird
- 如何在回调函数中执行流
- 回调函数中传递参数的困难(Google Map API Markers)
- Soundcloud Javascript SDK 3.0-回调无法读取属性'connectCallback
- 如何使用jqueryAJAX从页面中回调多个变量
- jquery Onclick函数带有导致双击的回调排序函数
- Javascript点击事件回调不起作用
- 一旦加载并渲染了角度引导typeahead,就使用回调
- 成功回调永远不会被JSONP请求调用
- 如何让程序员在javascript中实现正确的回调
- 回调高于回调