從 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]);

那應該可以解決問題。