谷歌地图和ajax

Question

是否有可能从$ .ajax调用中返回一个变量，更具体地说是一个值的数组或字符串。我目前明白，这是无法完成的......即需要立即将$ .ajax响应添加到DOM中。如果我在这里丢失了一些明显的东西，请纠正我。

var infoWindow; 
var tableID = 'atableID';  
var str; 



var beachID; 
var beach_location; 
var beach_region; 

/* start map initialization */ 
function initialize() { 
latlng = new google.maps.LatLng(49.894634, -97.119141); 
var myOptions = { 
    center: latlng, 
    zoom: 7, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    zoomControlOptions: { 
     style: google.maps.ZoomControlStyle.SMALL 
    }, 
    mapTypeControl: true, 
    mapTypeControlOptions: { 
     mapTypeIds: [ 
             google.maps.MapTypeId.ROADMAP, 
             google.maps.MapTypeId.SATELLITE, 
             google.maps.MapTypeId.HYBRID, 
             google.maps.MapTypeId.TERRAIN 
            ], 

     style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
    }, 
    overviewMapControl: true, 
    overviewMapControlOptions: { 
     opened: true 
    } 
}; 

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

layer = new google.maps.FusionTablesLayer({ 
    query: { 
     select: 'Point', 
     from: atableID 
    }, 
    suppressInfoWindows: true 
}); 
layer.setMap(map); 
infoWindow = new google.maps.InfoWindow(); 

google.maps.event.addListener(layer, 'click', function (e) { 


    // close infoWindow if open 
    if (infoWindow) { 
     infoWindow.close(); 
    } 
    beachID = e.row['Beach_ID'].value; 
    beach_location = e.row['Beach_Location'].value; ; 
    beach_region = e.row['Beach_Region'].value;; 

    //console.log(beachID); 

    // get data set 
    getEcoliData(beachID,beach_location,beach_region); 
    getAlgaeData(beachID,beach_location,beach_region); 


});   // end google.maps.addListener 
} // end map initialization 

function getEcoliData(beachID,beach_location,beach_region) { 
//local namespace 
var rows = []; 
var ecoliTable; 

var items = []; 

var queryURL = "https://www.googleapis.com/fusiontables/v1/query?sql="; 
var queryTail = '&key=a key value=?'; 
var whereClause = "WHERE 'Beach_ID' = " + beachID; 
var query = "SELECT 'Sample_Date', 'Average_E._coli_Density','Recreational_Water_Quality_Guideline' FROM atblid " + whereClause + " ORDER BY 'Sample_Date' DESC"; 
var queryText = encodeURI(query); 



    $.ajax({ 
    type: "GET", 
    url: queryURL + queryText + queryTail, 
    cache: false, 
    dataType: 'jsonp', 
    success: function (data) { 
     rows = data.rows; 

     // empty table 
     //$('#content_placeholder').empty(); 
     //$('.ecoli_table').remove(); 

     $('#ecoli_heading').empty(); 

     $('#content_placeholder').prepend('<h6 id="ecoli_heading">E.Coli Data</h6>') 
      .append('<p>' + beach_location + '</p>').append('<p>' + beach_region + '</p>'); 
     $('.ecoli_table').append('<tr>' 
           + '<th>Sample Date</th>' 
           + '<th>Average E.Coli Density</th>' 
           + '<th>Recreational Water Quality Guideline</th>' 
           + '</tr>'); 
     for (var i = 0; i < rows.length; i++) { 
      //items.push(rows[i]); 
      $('.ecoli_table tr:first').after('<tr><td>' + rows[i].join('</td><td>') + '</td></tr>'); 
     } 
     if (typeof ecoliTable == 'undefined') { 
      // dataTables 
      ecoliTable = $(".ecoli_table").dataTable({ 
       "sPaginationType": "full_numbers", 
       "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], 
       "aaSorting": [[0, "desc"]], 
       "bDestroy": true, 
       "aoColumns": [ 
                { "sTitle": "Sample_Date" }, 
                { "sTitle": "Average_E._coli_Density" }, 
                { "sTitle": "Recreational_Water_Quality_Guideline" } 
              ] 
      }); 
     } else { 
      //ecoliTable.fnDestroy(); 
      $(".ecoli_table > tbody").empty(); 
      ecoliTable.fnDraw(); 
      //$('.ecoli_table').find("tr:gt(0)").remove(); 
     } 
    }, 
    error: function() { 
     alert("Data is not available for this location at the present time, please check back at a later time. Thank you."); 
    } 
}); 
} 


function getAlgaeData(beachID,beach_location,beach,region) { 
//local namespace 
var rows = []; 
var algaeTable; 

var items = []; 

var queryURL = "https://www.googleapis.com/fusiontables/v1/query?sql="; 
var queryTail = '&key=apikey&callback=?'; 
var whereClause = "WHERE 'Beach_ID' = " + beachID; 
var query = "SELECT 'Sample_Date','Algal_Toxin_Microcystin','Recreational_Guideline_20','Blue_Green_Algae_Cells','Recreational_Guideline' FROM tableid " + whereClause + " ORDER BY 'Sample_Date' DESC"; 
var queryText = encodeURI(query); 



$.ajax({ 
    type: "GET", 
    url: queryURL + queryText + queryTail, 
    cache: false, 
    dataType: 'jsonp', 
    success: function (data) { 
     rows = data.rows; 

     // empty table 
     //$('#content_placeholder').empty(); 
     //$('.algae_table').remove(); 

     $('#algae_heading').empty(); 
     $('.ecoli_table').after('<h6 id="algae_heading">Algae Data</h6>'); 
     $('.algae_table').append('<tr>' 
           + '<th>Sample Date</th>' 
           + '<th>Algal_Toxin_Microcystin</th>' 
           + '<th>Recreational_Guideline_20</th>' 
           + '<th>Blue_Green_Algae_Cells</th>' 
           + '<th>Recreational_Guideline</th>' 
           + '</tr>'); 
     for (var i = 0; i < rows.length; i++) { 
      //items.push(rows[i]); 
      $('.algae_table tr:first').after('<tr><td>' + rows[i].join('</td><td>') + '</td></tr>'); 
     } 
     if (typeof algaeTable == 'undefined') { 
      //algae 
      algaeTable = $(".algae_table").dataTable({ 
       "sPaginationType": "full_numbers", 
       "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], 
       "bDestroy": true, 
       "aaSorting": [[0, "desc"]], 

       "aoColumns": [ 
                  { "sTitle": "Sample_Date" }, 
                  { "sTitle": "Algal_Toxin_Microcystin" }, 
                  { "sTitle": "Recreational_Guideline_20" }, 
                  { "sTitle": "Blue_Green_Algae_Cells" }, 
                  { "sTitle": "Recreational_Guideline" } 
                ] 
      }); 
     } else { 
      //algaeTable.fnDestroy(); 
      $(".algae_table > tbody").empty(); 
      algaeTable.fnDraw(); 
      //$('.algae_table').find("tr:gt(0)").remove(); 
     } 


    }, 
    error: function() { 
     alert("Data is not available for this location at the present time, please check back at a later time. Thank you."); 
    } 
}); 
} 

我想查询2个不同的谷歌融合表格和谷歌信息窗口内的新选项卡下返回每个表。然而，我遇到了问题，因为我似乎无法将数组或字符串从$ .ajax函数返回到父范围。例如，上面的items数组返回undefined。任何想法都非常感谢。

由于提前， 迈克尔

Answer 1

这是绝对有可能的。您尚未提供足够的代码来确定发生了什么问题，例如queryURL，queryText等。您还需要您的Google API密钥。以下是演示如何操作的示例。

https://developers.google.com/fusiontables/docs/samples/basic_jsonp_request