融合表查询 >500 个结果答案

【问题标题】：Fusion Table Query >500 results融合表查询 >500 个结果
【发布时间】：2015-09-10 00:35:47
【问题描述】：

我正在尝试为具有 20,000 行数据的融合表创建和使用查询，并且该查询可以访问完整的数据集我想要达到的目标类似于Sample Fusion Table Query

但是它使用 google.visualization.Query('http://www.google.com/fusiontables/gvizdata... 仅限于 500 个结果。我想使用https://www.googleapis.com/fusiontables/v1/query 或https://www.googleapis.com/fusiontables/v2/query 来执行与此示例完全相同的操作，但没有500 个结果限制。我已经尝试过但失败了，我正在寻找一个可以向我展示样本以让我走上正轨的人。

  <!DOCTYPE html>
     <html>
   <head>
     <title>Google Maps JavaScript API v3 Example: Map Simple</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
     <meta charset="utf-8">
     <style>
       html, body, #map {
         margin: 0;
         padding: 0;
         height: 100%;
       }
     </style>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<!--Load the AJAX API-->
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript" >
// var tableId = "1zELV0V48On-5c8aqKM_PD2cMQtfy4hByyR5o8sQ";
var tableId = "1_2tuZiYRkUZyLEd2fEGqYXYK7FV6i1hUCXk_Pkbv";
 // my version "1t1QYYwy5AXgaV0biCpHwzh4cVM0iv0aVyBVHNAo"'
var geocoder = new google.maps.Geocoder();
var FusionTablesData = null;
google.load('visualization', '1', {'packages':['table']});
var map;
var markers = [];
var infoWindow = new google.maps.InfoWindow();

function initialize() {
var thames = new google.maps.LatLng(-37.14533531325433, 175.56108373542384);

map = new google.maps.Map(document.getElementById('map_canvas'), {
center: thames,
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP
});

var FTlayer = new google.maps.FusionTablesLayer({query:{from:tableId}, map:map});

var queryStr = "SELECT ASSETID, Start_Coordinates, Phone, Url FROM "+tableId+" ORDER BY ASSETID";
document.getElementById('info').innerHTML += queryStr +"<br>";
var queryText = encodeURIComponent(queryStr);

  var query = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq='  + queryText);

query.send(getData);
}

function getData(response) {
if (!response) {
  alert('no response');
  return;
}
if (response.isError()) {
  alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
  return;
} 
FusionTablesData = response.getDataTable();  
var dt = FusionTablesData

var side_html = '<table style="border-collapse: collapse" border="1" \
                   cellpadding="5"> \
                   <thead> \
                     <tr style="background-color:#e0e0e0"> \
                       <th>ASSETID</th> \
                     </tr> \
                   </thead> \
                   <tbody>';
document.getElementById('info').innerHTML += "rows="+dt.getNumberOfRows()+"<br>";
for (var i = 0; i < dt.getNumberOfRows(); i++) {
  var  location = dt.getValue(i,1);
  var  phone = dt.getValue(i,2);
  var ASSETID = dt.getValue(i,0);
  var url = dt.getValue(i,3);

  var html = "<strong><a href='"+url+"'>" + ASSETID + "</a></strong><br />";
  html += location + "<br/>";
  html += phone + "<br/>";
  side_html += '<tr> \
                  <td><a href="javascript:myclick(' + i + ')">' + ASSETID + '</a></td> \
                </tr>';


  // geocodeMarker(location, html, i);

}

side_html += '</tbody> \
            </table>';
document.getElementById("side_bar").innerHTML = side_html;
}

function geocodeMarker(location, html, i, click) {
  geocoder.geocode({address:location}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      markers[i] = createMarker(results[0].geometry.location, html)
      map.setZoom(18);    
      if (click) google.maps.event.trigger(markers[i], 'click');
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
      map.setZoom(10);
      infoWindow.close();
    }
  });
}

function createMarker(point,info) {
  var myMarkerOpts = {
    position: point,
    icon: { url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle.png",
      size: new google.maps.Size(7,7),
      anchor: new google.maps.Point(4,4)
    } /*,
    map: map */
  };

  var marker = new google.maps.Marker(myMarkerOpts);

  google.maps.event.addListener(marker, 'click', function() {
    infoWindow.close();
    infoWindow.setContent(info);
    infoWindow.setPosition(point);
    infoWindow.open(map); 
  });
  return marker;
}

function myclick(num) {
  var dt = FusionTablesData; 
  if (!markers[num]) {
    var  location = dt.getValue(num,1);
    var  phone = dt.getValue(num,2);
    var ASSETID = dt.getValue(num,0);
    var url = dt.getValue(num,3);
    var html = "<strong><a href='"+url+"'>" + ASSETID + "</a></strong><br />";
    if (!!location) html += location + "<br/>";
    if (!!phone) html += phone + "<br/>";
    geocodeMarker(location, html, num, true);
  } else {
    google.maps.event.trigger(markers[num], "click");
  }
}
</script>

   <body onload="initialize();">
<table border="1"><tr><td>
     <div id="map_canvas" style="width:600px;height:500px;"></div>
     </td><td>
     <div id="side_bar" style="width:200px;height:500px; overflow: auto;"></div>
</td></tr></table>

<div id="info"></div>
   </body>
 </html>

我知道这将是一种不同的方法，这里的任何帮助将不胜感激

我尝试遵循示例Getting around the 500 row limit ...但即使在根据我的要求进行调整后似乎也无法使其工作，我真的没有这个示例，因为它不起作用，如下是我正在尝试的代码（我知道可能还有很长的路要走......）

<!DOCTYPE html>
<html>

<head>
  <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <!--Load the AJAX API-->
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  <script type="text/javascript">
    var tableId = "1_2tuZiYRkUZyLEd2fEGqYXYK7FV6i1hUCXk_Pkbv";
    var geocoder = new google.maps.Geocoder();
    var FusionTablesData = null;
    google.load('visualization', '1', {
      'packages': ['table']
    });
    var map;
    var markers = [];
    var infoWindow = new google.maps.InfoWindow();
    var assetsarray = [];
    var locationssarray = [];
    var urlsarray = [];
    var resultarray = [];

    function initialize() {
      var thames = new google.maps.LatLng(-37.14533531325433, 175.56108373542384);

      map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: thames,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      var FTlayer = new google.maps.FusionTablesLayer({
        query: {
          from: tableId
        },
        map: map
      });

      var queryStr = "";
      document.getElementById('info').innerHTML += queryStr;
      var queryText = encodeURIComponent(queryStr);
      var query = "SELECT ASSETID, Start_Coordinates, Impressions FROM " +
        '19VtUfrmaFz1Jk6IumyvW7Q5chzZvLQlTmbewU1rM';
      var encodedQuery = encodeURIComponent(query);

      // Construct the URL to grab the data
      var url = ['https://www.googleapis.com/fusiontables/v1/query'];
      url.push('?sql=' + encodedQuery);
      url.push('&key=AIzaSyAm9yWCV7JPCTHCJut8whOjARd7pwROFDQ');
      url.push('&callback=?');

      // Set the number of rows
      var numRows = 20000;

      // Get the variables from the table, in a loop
      $.ajax({
        url: url.join(''),
        dataType: 'jsonp',
        success: function(result) {
          //alert("fusion table query success");
          var rows = result['rows'];
          var side_html = '<table style="border-collapse: collapse" border="1" \
                   cellpadding="5"> \
                   <thead> \
                     <tr style="background-color:#e0e0e0"> \
                       <th>ASSETID</th> \
                     </tr> \
                   </thead> \
                   <tbody>';
          document.getElementById('info').innerHTML += "rows=" + rows.length + "<br>";

          //alert(rows.length);
          for (var i in rows) {
            var asset_id = rows[i][0];
            var location = rows[i][1];
            var imps = rows[i][2];
            assetsarray.push(rows[i][0]);
            locationssarray.push(rows[i][1]);
            urlsarray.push(rows[i][2]);



            resultarray.push(rows[i][0], rows[i][1], rows[i][2]);
            side_html += '<tr> \
                  <td><a href="javascript:myclick(' + i + ')">' + rows[i][0] + '</a></td> \
                </tr>';
          }
          side_html += '</tbody> \
            </table>';
          document.getElementById("side_bar").innerHTML = side_html;
        }

      });
    }

    function geocodeMarker(location, html, i, click) {
      geocoder.geocode({
        address: location
      }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          markers[i] = createMarker(results[0].geometry.location, html)
          map.setZoom(18);
          if (click) google.maps.event.trigger(markers[i], 'click');
        } else {
          alert('Geocode was not successful for the following reason: ' + status);
          map.setZoom(10);
          infoWindow.close();
        }
      });
    }

    function createMarker(point, info) {
      var myMarkerOpts = {
        position: point,
        icon: {
          url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle.png",
          size: new google.maps.Size(7, 7),
          anchor: new google.maps.Point(4, 4)
        }
        /*,
            map: map */
      };

      var marker = new google.maps.Marker(myMarkerOpts);

      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.close();
        infoWindow.setContent(info);
        infoWindow.setPosition(point);
        infoWindow.open(map);
      });
      return marker;
    }

    function myclick(num) {
      var dt = resultarray;
      if (!markers[num]) {
        var location = locationssarray[num];
        var ASSETID = assetsarray[num];
        var url = urlsarray[num];
        var html = "<strong><a href='" + url + "'>" + ASSETID + "</a></strong><br />";
        if (!!location) html += location + "<br/>";
        geocodeMarker(location, html, num, true);
      } else {
        google.maps.event.trigger(markers[num], "click");
      }
    }
  </script>

  <body onload="initialize();">
    <table border="0">
      <tr>
        <td>
          <div id="map_canvas" style="width:400px;height:700px;"></div>
        </td>
        <td>
          <div id="side_bar" style="width:60px;height:700px; overflow: auto;"></div>
        </td>
      </tr>
    </table>

    <div id="info" style="display: none;"></div>

  </body>

</html>

非常感谢

【问题讨论】：

您尝试使用融合表查询（v1/v2 不是可视化库）的代码是什么样的？
想要的表是私有的吗（至少1zELV0V48On-5c8aqKM_PD2cMQtfy4hByyR5o8sQ是私有的）？当它是私有时，您希望任何用户都能看到结果（所谓的离线访问）还是只有授权用户才能看到结果（在线访问）
请从您的代码中删除我的谷歌分析标签（“UA-162157-1”）。
您的表格是否包含坐标？还是只是地址？
嗨，Molle 博士，感谢我在发布样本时犯的错误。我使用了 Start_Coordinates，它是表中的位置字段。我已经设法让一个版本可以完成我需要它做的事情，那里可能有冗余代码，可以清理和简化它，但它目前对我有用。我也把它贴出来供任何人评论和批评。非常感谢

标签： sql google-fusion-tables

【解决方案1】：

我设法用下面的代码解决了我的问题，唯一的问题是让 ajax 在完成查询之前等待。这仍然没有解决

<!DOCTYPE html>
<html>

<head>
  <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <!--Load the AJAX API-->
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  <script type="text/javascript">
    var tableId = "1_2tuZiYRkUZyLEd2fEGqYXYK7FV6i1hUCXk_Pkbv";
    var geocoder = new google.maps.Geocoder();
    var FusionTablesData = null;
    google.load('visualization', '1', {
      'packages': ['table']
    });
    var map;
    var markers = [];
    var infoWindow = new google.maps.InfoWindow();
    var assetsarray = [];
    var locationssarray = [];
    var urlsarray = [];
    var resultarray = [];

    function initialize() {
      var thames = new google.maps.LatLng(-37.14533531325433, 175.56108373542384);

      map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: thames,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      var FTlayer = new google.maps.FusionTablesLayer({
        query: {
          from: tableId
        },
        map: map
      });

      var queryStr = "";
      document.getElementById('info').innerHTML += queryStr;
      var queryText = encodeURIComponent(queryStr);
      var query = "SELECT ASSETID, Start_Coordinates, Impressions FROM " +
        '19VtUfrmaFz1Jk6IumyvW7Q5chzZvLQlTmbewU1rM';
      var encodedQuery = encodeURIComponent(query);

      // Construct the URL to grab the data
      var url = ['https://www.googleapis.com/fusiontables/v1/query'];
      url.push('?sql=' + encodedQuery);
      url.push('&key=AIzaSyAm9yWCV7JPCTHCJut8whOjARd7pwROFDQ');
      url.push('&callback=?');

      // Set the number of rows
      var numRows = 20000;

      // Get the variables from the table, in a loop
      $.ajax({
        url: url.join(''),
        dataType: 'jsonp',
        success: function(result) {
          //alert("fusion table query success");
          var rows = result['rows'];
          var side_html = '<table style="border-collapse: collapse" border="1" \
                   cellpadding="5"> \
                   <thead> \
                     <tr style="background-color:#e0e0e0"> \
                       <th>ASSETID</th> \
                     </tr> \
                   </thead> \
                   <tbody>';
          document.getElementById('info').innerHTML += "rows=" + rows.length + "<br>";

          //alert(rows.length);
          for (var i in rows) {
            var asset_id = rows[i][0];
            var location = rows[i][1];
            var imps = rows[i][2];
            assetsarray.push(rows[i][0]);
            locationssarray.push(rows[i][1]);
            urlsarray.push(rows[i][2]);



            resultarray.push(rows[i][0], rows[i][1], rows[i][2]);
            side_html += '<tr> \
                  <td><a href="javascript:myclick(' + i + ')">' + rows[i][0] + '</a></td> \
                </tr>';
          }
          side_html += '</tbody> \
            </table>';
          document.getElementById("side_bar").innerHTML = side_html;
        }

      });
    }

    function geocodeMarker(location, html, i, click) {
      geocoder.geocode({
        address: location
      }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          markers[i] = createMarker(results[0].geometry.location, html)
          map.setZoom(18);
          if (click) google.maps.event.trigger(markers[i], 'click');
        } else {
          alert('Geocode was not successful for the following reason: ' + status);
          map.setZoom(10);
          infoWindow.close();
        }
      });
    }

    function createMarker(point, info) {
      var myMarkerOpts = {
        position: point,
        icon: {
          url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle.png",
          size: new google.maps.Size(7, 7),
          anchor: new google.maps.Point(4, 4)
        }
        /*,
            map: map */
      };

      var marker = new google.maps.Marker(myMarkerOpts);

      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.close();
        infoWindow.setContent(info);
        infoWindow.setPosition(point);
        infoWindow.open(map);
      });
      return marker;
    }

    function myclick(num) {
      var dt = resultarray;
      if (!markers[num]) {
        var location = locationssarray[num];
        var ASSETID = assetsarray[num];
        var url = urlsarray[num];
        var html = "<strong><a href='" + url + "'>" + ASSETID + "</a></strong><br />";
        if (!!location) html += location + "<br/>";
        geocodeMarker(location, html, num, true);
      } else {
        google.maps.event.trigger(markers[num], "click");
      }
    }
  </script>

  <body onload="initialize();">
    <table border="0">
      <tr>
        <td>
          <div id="map_canvas" style="width:400px;height:700px;"></div>
        </td>
        <td>
          <div id="side_bar" style="width:60px;height:700px; overflow: auto;"></div>
        </td>
      </tr>
    </table>

    <div id="info" style="display: none;"></div>

  </body>

</html>

期待对上述代码的任何反馈，非常感谢

【讨论】：