jquery - 使用 google 可视化 api 查询多个表

Question

问题:目前，我的代码可以完美地从一个表中提取数据，但我想要做的是从多个谷歌表中提取相同的数据。

我的尝试:我尝试了不同的查询变体，但当我有多个表 IDS 时，该表就不会显示。

工作查询:

var query = "SELECT 'City', 'Name', 'Gender', 'Full Address', 'Phone', 'Fax' " + 'FROM 117_2OT0fNljnKrx40V76XuoIFIm-IK6e5Zf3N2o'; 

尝试:(查询的 FROM 部分是发生更改的部分)

 var query = "SELECT 'City', 'Name', 'Gender', 'Full Address', 'Phone', 'Fax' " + 'FROM "117_2OT0fNljnKrx40V76XuoIFIm-IK6e5Zf3N2o", "1npicUMaGTzjeDuvaDeq_F07V0Flmo1I3y3agGAc", "1BW-kAdtSNggLYOjGKeemSDRCj2eG0VF6R8wLX9w", "1yHhe0GkTBReuFdXelbAeqLzhknnNbs4JdAspndM", "1mfmx02FN7E3_G9J2BHv9FayK-UCz5BuFcxJ6j3A"'; 

整个谷歌可视化代码:

  google.load('visualization', '1', { packages: ['table'] });
  function drawTable() { 
  var query = "SELECT 'City', 'Name', 'Gender', 'Full Address', 'Phone', 'Fax' " + 'FROM 117_2OT0fNljnKrx40V76XuoIFIm-IK6e5Zf3N2o'; 
  var state = document.getElementById('state').value; 

  if (state) { query += " WHERE 'State' = '" + state + "'"; } 
  var queryText = encodeURIComponent(query);
  var gvizQuery = new google.visualization.Query( 'http://www.google.com/fusiontables/gvizdata?tq=' + queryText); 

  gvizQuery.send(function(response) { 
  var table = new google.visualization.Table( document.getElementById('visualization')); 
  table.draw(response.getDataTable(), { showRowNumber: false,           sortAscending: true,            sortColumn: 0 }); 
  });

  } google.setOnLoadCallback(drawTable);

Answer 1

Fusion Tables 的查询 API 类似于 SQL，但与 SQL 不兼容。如果要处理表连接，则必须运行多个查询并使用 google.visualization.data.join方法。下面是一个基本框架，您可以使用它来将 5 个表的结果连接在一起:

var url = 'http://www.google.com/fusiontables/gvizdata?tq=';
var q1 = new google.visualization.Query(url);
q1.setQuery('SELECT <columns from table 1> FROM <table 1 id>');
q1.send(function (r1) {
    var data1 = r1.getDataTable();

    var q2 = new google.visualization.Query(url);
    q2.setQuery('SELECT <columns from table 2> FROM <table 2 id>');
    q2.send(function (r2) {
        var data2 = r2.getDataTable();

        var q3 = new google.visualization.Query(url);
        q3.setQuery('SELECT <columns from table 3> FROM <table 3 id>');
        q3.send(function (r3) {
            var data3 = r3.getDataTable();

            var q4 = new google.visualization.Query(url);
            q4.setQuery('SELECT <columns from table 4> FROM <table 4 id>');
            q4.send(function (r4) {
                var data2 = r4.getDataTable();

                var q5 = new google.visualization.Query(url);
                q5.setQuery('SELECT <columns from table 5> FROM <table 5 id>');
                q5.send(function (r5) {
                    var data5 = r5.getDataTable();

                    var join1 = google.visualization.data.join(
                        data1,
                        data2,
                        <join method>,
                        [[<key column in data 1>, <matching key column in data 2>] /* etc */],
                        [<non-key columns from data 1>],
                        [<non-key columns from data 2>]
                    );
                    // repeat to join all tables together
                });
            });
        });
    });
});