从 Google 表格中提取数据以在 Google 脚本上制作甘特图并将 HTML 作为网络应用程序提供

Question

我正在尝试在 Google Script 上创建 Google 甘特图，从 Google Sheets 电子表格中提取数据以将 HTML 作为网络应用程序提供。 我设法用其他类型的图表来解决这个问题，但我认为日期格式存在一些问题，因为我不断收到错误信息，例如“无效的数据表格式：第 3 列必须是‘日期’类型”

我不熟悉 Javascript，所以我真的迷路了。 这是我的 Code.gs 上的代码。 该文件必须是私有的，它在我的工作 Gsuite 上，但它是一个简单的测试，数据的格式与Google Gantt Charts 文档中的格式相同。

function doGet() {

  return HtmlService
  .createTemplateFromFile("Index")
  .evaluate()
  .setTitle("MKT Simple Cycle")
  .setSandboxMode(HtmlService.SandboxMode.IFRAME);  
}


function getCycle() {

  var ssID   = "1p4jEZtSk4GoVWvR9OrZj2ou1dpUbl6GHYUlJ1bSVY-s",
  sheet  = SpreadsheetApp.openById(ssID).getSheets()[0],
  data   = sheet.getDataRange().getValues();
  return data

}

这是我的 Javascript.html 上的代码：

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
google.charts.load('current', {'packages':['gantt']});
google.charts.setOnLoadCallback(getCycle);

function getCycle() {
  google.script.run.withSuccessHandler(drawChart).getCycle();
}

function drawChart(rows) {

  var data = google.visualization.arrayToDataTable(rows, false);

  var options = {
    height: 400,
    gantt: {
      trackHeight: 30
    }
  };

  var chart = new google.visualization.Gantt(document.getElementById('Cycle'));

  chart.draw(data, options);

}

Answer 1

这里的问题是sheet.getDataRange().getValues(); 返回字符串，甘特图需要开始日期和结束日期作为 javascript 日期对象。

循环遍历data的数组，使用 Date 对象转换单元格 3 和 4 中的字符串（如果您的工作表中有资源 ID列，或者单元格 2 和 3，如果没有）。

row[2] = new Date(row[2]);
row[3] = new Date(row[3]);

那应该可以解决问题。