谷歌可视化图表数据范围答案

【问题标题】：Google Visualization Chart Data Range谷歌可视化图表数据范围
【发布时间】：2015-02-16 04:38:28
【问题描述】：

我有这个代码，

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", '1', {packages:['corechart']});
google.setOnLoadCallback(drawChart);
function drawChart() {
  var query = new google.visualization.Query(
      'https://docs.google.com/spreadsheets/d/1ntnhvfMhYtFNwFjkoKu8cUZOQPCaT5_U1Z6piB_w0-E/edit#gid=0');
  query.setQuery('order by A');
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
    return;
  }

  var options = {
          title: 'TEMP & HUMID',
    hAxis: {
        direction: -1
        },
    legend: 'none'

      };

  var data = response.getDataTable();
  var chart = new google.visualization.LineChart(document.getElementById('columnchart'));
  chart.draw(data, options);
}
</script>

<title>Data from a Spreadsheet</title>
</head>

<body>
    <div id="columnchart" style="width: 900px; height: 500px"></div>
</body>
</html>

这是我的电子表格数据：https://docs.google.com/spreadsheets/d/1ntnhvfMhYtFNwFjkoKu8cUZOQPCaT5_U1Z6piB_w0-E

我想要做的是绘制最后 5 个数据。 即）我的电子表格中的第 8 - 12 行。

我尝试了限制和范围查询，但我想做的是，如果有新数据进来，我希望图表引用更新后的最后 5 个数据即）第 9 行 -13

我怎样才能做到这一点？

【问题讨论】：

标签： charts google-visualization

【解决方案1】：

我不知道这是否是最好的方法，但我已经解决了。

所以，在绘制表格之前，我实际上是以 JSON 格式调用电子表格并检索其列长。

然后我用我想要显示的数据数减去列长度（限制查询），这将使我开始偏移。

然后我创建了一个值为limit和offset的字符串，将查询选项传递给query.setQuery。

这是该部分的代码。

function drawChart() {
  var query = new google.visualization.Query(
      'https://docs.google.com/spreadsheets/d/1NSEbUWojJsMzhH0hi8kx8ic7Xxuq29z0c7BXs-inzb8/edit#gid=0');
    $.getJSON("https://spreadsheets.google.com/feeds/list/1NSEbUWojJsMzhH0hi8kx8ic7Xxuq29z0c7BXs-inzb8/od6/public/basic?hl=en_US&alt=json", function(data) {
    colLen = data.feed.entry.length;
    console.log(colLen);
    limit = 4;
    var offset = colLen - limit;
    console.log(offset);
    queryOption = "limit "+limit+" offset "+offset;
    console.log(queryOption);

    query.setQuery(queryOption);
    query.send(handleQueryResponse);
    });
}

【讨论】：