現在、Facebook グラフ API をいじっています。すべてのユーザーの友人のプロフィール写真やその他のデータを取得し、それらをマーカーとして Google マップに配置しています。
動作していますが、表示される前にすべてのデータと画像が返されるのを待っているようです。これがあまりにも漠然としている場合は申し訳ありません、私は初心者です。JSON 呼び出しをいくつかのコールバック関数に分割しようとしましたが、これは役に立ちませんでした。データを受け取り次第、各フレンズの画像を配置したいです。
私のコードは以下のとおりです ( jquery を使用して JSON を取得するための 4 つの呼び出し)。最初の呼び出しで友人リストを取得し、次に友人ごとに画像とデータを取得し、次に位置データを取得します。
$.getJSON("https://graph.facebook.com/" + userid + "/friends?access_token=" + token, function(data) {
$.each(data.data, function(key, val) {
$.getJSON("https://graph.facebook.com/"+ val.id + "?fields=picture", function(idata) {
var img = new Image();
img.src = idata.picture;
$.getJSON("https://graph.facebook.com/"+ val.id + "?access_token=" + token, function(fdata) {
$.getJSON("https://graph.facebook.com/"+ fdata.location.id + "?access_token=" + token , function(ldata) {
$('#map_canvas').gmap('addMarker', {
'id': 'mark',
'position': ldata.location.latitude + ',' + ldata.location.longitude,
'draggable': false,
'bounds': false,
'icon' : image.src,
'title' : fdata.name,
'animation': google.maps.Animation.DROP,
}).click(function() {
$('#map_canvas').gmap('openInfoWindow', {'content': 'Name: ' + fdata.name + '</br>Location: ' + fdata.location.name }, this);
});
});
});
});
});
});