Question

我正在使用谷歌注释图表遇到一些问题。我从Google提供的示例开始，然后尝试通过Fiddle调整它以使用来自google sheets document的查询中的数据。

我觉得我已经搞乱了查询本身，或者将查询结果放入图表并绘制它。

非常感谢任何帮助。我的Javscript包含在下面。

            google.charts.load('current', {'packages':['annotationchart']});
      google.charts.setOnLoadCallback(drawChart);


      function initialize() {
            var opts = {sendMethod: 'auto'};
  // Replace the data source URL on next line with your data source URL.
        var query = new google.visualization.Query('https://docs.google.com/spreadsheets/d/1KVOMq2usUg-FRmfx9cnGgJVR-wQZ2oJcyufaIgcxzFw', opts);

  // Optional request to return only column C and the sum of column B, grouped by C members.
            query.setQuery('select B, select G');

  // Send the query with a callback function.
            query.send(handleQueryResponse);
}

            function handleQueryResponse(response) {

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

              var data = response.getDataTable();
        var chart = new google.visualization.AnnotationChart(document.getElementById('chart_div'));

        var options = {
          displayAnnotations: false
        };

        chart.draw(data, options);        
}

Answer 1

几件事......

指定的回调函数不存在更改 - drawChart至 - initialize
（已添加到下面的load声明中，而不是使用 - setOnLoadCallback）
选择列的查询不正确
更改 - select B, select G至 - select B, G
（添加到以下网址而不是使用 - query.setQuery）

请参阅以下工作代码段...

＆＃13;

google.charts.load('current', {
  callback: initialize,
  packages: ['annotationchart']
});

function initialize() {
  var opts = {sendMethod: 'auto'};
  // Replace the data source URL on next line with your data source URL.
  var query = new google.visualization.Query('https://docs.google.com/spreadsheets/d/1KVOMq2usUg-FRmfx9cnGgJVR-wQZ2oJcyufaIgcxzFw/gviz/tq?tq=select B,G', opts);

  // Send the query with a callback function.
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
    return;
  }

  var data = response.getDataTable();
  var chart = new google.visualization.AnnotationChart(document.getElementById('chart_div'));

  var options = {
    displayAnnotations: false
  };

  chart.draw(data, options);
}

＆＃13;

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

＆＃13;

从Google表格查询中制作Google注释图表

1 个答案: