如何在Google Apps脚本中创建具有一天中的时间栏的条形图

Question

我尝试使用Google Apps脚本创建一个堆积的条形图，其中包含一天中的时间列。如下图。

我创建了以下Google Apps脚本代码。但是，它不起作用。

function createSample(){
  var data = Charts.newDataTable()
    .addColumn(Charts.ColumnType.STRING, "date")
    .addColumn(Charts.ColumnType.TIMEOFDAY, "A")  // TIMEOFDAY is not defined in google apps script
    .addColumn(Charts.ColumnType.TIMEOFDAY, "B")  // TIMEOFDAY is not defined in google apps script
    .addRow(["2/22", [10, 00, 00], [10, 00, 00]])
    .addRow(["2/23", [8, 00, 00], [8, 00,00]])
    .addRow(["2/24", [5, 00, 00], [5, 00, 00]])
    .build();
  
  var chart = Charts.newColumnChart()
    .setDataTable(data)
    .setStacked()
    .build();

}

我认为Google图表可以表示带有时间栏的条形图。但是我不知道如何在Google Apps脚本中创建它。

Answer 1

使用Google Visualization API绘制图表

gs：

function showChartDialog() {
  var ui=HtmlService.createHtmlOutputFromFile('ah2').setHeight(500).setWidth(500);
  SpreadsheetApp.getUi().showModelessDialog(ui, 'Chart')
}

html：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script>google.charts.load('current', {'packages':['corechart','bar']});</script>
  </head>
  <body>
  <div id="cht"></div><input type="button" value="Draw" onClick="createSample();" />
  <script>
    function createSample(){
      var data = new google.visualization.DataTable();
      data.addColumn('date', "Date");
      data.addColumn('timeofday', "A"); 
      data.addColumn('timeofday', "B"); 
      data.addRow([new Date(2020,2,22),[22,00,00],[22,00,00]]);
      data.addRow([new Date(2020,2,23),[20,00,00],[20,00,00]]);
      data.addRow([new Date(2020,2,24),[17,00,00],[17,00,00]]);
      var options = {
        title: 'Column Chart',
        width: 600,
        height: 400,
        bar: { groupWidth: '75%' },
        isStacked: true
        };
      var chart=new google.visualization.ColumnChart(document.getElementById('cht'));
      chart.draw(data,options)
    }
  </script>
  </body>
</html>

如何在Google Apps脚本中创建具有一天中的时间栏的条形图

问题描述投票：0回答：1

1个回答

最新问题

如何在Google Apps脚本中创建具有一天中的时间栏的条形图

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1