0

ajax を使用して場所のリストを取得し、ajax の結果から作成された配列に基づいて Google マップをマークします。コールバック関数を作成して、ajax 呼び出し、配列の構築、Google マップのすべての同期のマーク付けを行うにはどうすればよいですか (updateMapMarkers() は呼び出されません)。これが私のコードです。ありがとう

// main function to do work  
// need timer calling getLocations()      
function loadMapList() {  
    // initial google map here  
    var count = 40;  
    $("#countdown").html(count + " seconds remaining!"); 
    getLocations();   
    count--;  
    timeout = setInterval(function(){   
      $("#countdown").html(count + " seconds remaining!");   
      if (count == 0) {  
        count =40;  
        getLocations();  
      }  
    count--;  
    }, 1000);  
}  
// using ajax to get location info  
function getLocations(){  
    var url = "getLocations";  
    $.ajax({  
    type: 'GET',   
    url: url,  
    dataType: 'json',  
    async: false,   
    success: function(data){  
    if (data.locationList == null || data == 'undefined') {  
      return;    
    }   
    allLocArray.length = 0;   
    for (i in data.locationList) {    
      allLocArray[i] = new Array(3);    
      allLocArray[i][0] = data.locationList[i].LOCATE_NAME;  
      allLocArray[i][1] = data.locationList[i].LATITUDE;    
    allLocArray[i][2] = data.locationList[i].LONGITUDE; 
    }
    },   
    error: function(xhr, textStatus, error){
    alert(xhr.statusText);
    alert(textStatus);
    alert(error);
    }
    });
    }  
// mark google map using global var array
function updateMapMarkers() {  
    var myOptions = {  
    zoom: zoomLevel,  
    center: new google.maps.LatLng(centerLat, centerLong),  
    mapTypeId: google.maps.MapTypeId.ROADMAP  
    }  
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);    
    for (var i=0; i<allLocArray.length; i++) {  
      var myLatLng = new google.maps.LatLng(allLocArray[i][1], allLocArray[i][2]);  
      var marker = new google.maps.Marker({  
        position: myLatLng,  
        map: map,  
        title:allLocArray[i][0]  
      });  
    }   
}
4

1 に答える 1

0

コールバック関数を引数として渡すだけです。

function getLocation(callback){
  ...
  callback();
  ...
}

function updateInfo(){
  ...
}      

getLocation(updateInfo);




編集:関数をチェーンして、「シリアル」実行の感覚を実現できます。


1.配列の使用

function foo(callbacks){
    ...
    for(c in callbacks)
        c();
}

function bar(){
    ...
}
function baz(){
    ...
}

foo([bar, baz]);


2. コールバック チェーンの使用

function foo(callback){
    ...
    callback()
}

function bar(callback){
    ...
    callback()
}
function baz(callback){
    ...
    callback()
}

foo(function(){
    bar(function(){
        baz(function(){
            alert('done');
        });
    });
});


3. クラスの使用 

class MyClass
{
    function foo(){
        ...
        return this;
    }

    function bar(callback){
        ...
        return this;
    }
    function baz(callback){
        ...
        return this;
    }
}

var obj = MyClass();
obj.foo().bar().baz()
于 2012-08-10T07:02:57.130 に答える