如何在 JavaScript 中更改时间格式？

Question

我正在尝试使用谷歌可视化制作时间线。我在文档示例代码中找到了，如果我只更改行值应该没问题。

我的数据看起来像这样TimeLineData 因此，您可以看到我拥有执行此操作所需的一切。

我的问题是如何更改 C 列和 D 列的日期

来自：[Thu Oct 29 09:05:00 GMT+09:00 2020] 为此：新日期（2020,10,29,9,5,0），

需要放入如下所示的行： （来自示例）

[ 'Magnolia Room', 'Beginning JavaScript',       new Date(0,0,0,12,0,0),  new Date(0,0,0,13,30,0) ],

我猜你可以使用整个范围的数组，但我不知道如何处理整个数组，所以我把它分成 4 个部分。不知道对不对。

电子表格中的数据与行中的数据顺序相同

 [ 'Machine', 'Product',       new Date(start),  new Date(end) ],

任何建议都会有所帮助！

这是我得到的：

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

<script type="text/javascript">

function timelineData(){
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const srcSheet = ss.getSheetByName("Array");
  const srcValues = srcSheet.getRange(2, 1, srcSheet.getLastRow(), srcSheet.getLastColumn()).getValues();
  
  
  const machine = srcSheet.getRange(2, 1, srcSheet.getLastRow()).getValues();
  const order = srcSheet.getRange(2, 2, srcSheet.getLastRow()).getValues();

  const startDate = srcSheet.getRange(2, 3, srcSheet.getLastRow()).getValues();
  const endDate = srcSheet.getRange(2, 4, srcSheet.getLastRow()).getValues();
        
  

}

  google.charts.load("current", {packages:["timeline"]});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {

    var container = document.getElementById('example3.1');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn({ type: 'string', id: 'Machine' });
    dataTable.addColumn({ type: 'string', id: 'Order' });
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows([
       [ 'Magnolia Room', 'Beginning JavaScript',       new Date(0,0,0,12,0,0),  new Date(0,0,0,13,30,0) ],
      [ 'Magnolia Room', 'Intermediate JavaScript',    new Date(0,0,0,14,0,0),  new Date(0,0,0,15,30,0) ],
      [ 'Magnolia Room', 'Advanced JavaScript',        new Date(0,0,0,16,0,0),  new Date(0,0,0,17,30,0) ],
      [ 'Willow Room',   'Beginning Google Charts',    new Date(0,0,0,12,30,0), new Date(0,0,0,14,0,0) ],
      [ 'Willow Room',   'Intermediate Google Charts', new Date(0,0,0,14,30,0), new Date(0,0,0,16,0,0) ],
      [ 'Willow Room',   'Advanced Google Charts',     new Date(0,0,0,16,30,0), new Date(0,0,0,18,0,0) ]

    ]);

    chart.draw(dataTable);
  }
</script>

<div id="example3.1" style="height: 200px;"></div>

所以我用@Marios 的代码编辑了代码，现在看起来像这样：

     function drawChart() {
    const ss = SpreadsheetApp.getActiveSpreadsheet();
  const srcSheet = ss.getSheetByName("timeLineData");
  const srcValues = srcSheet.getRange('A2:D'+srcSheet.getLastRow()).getValues();
  const newAr = srcValues.map(r=>[r[0],r[1],new Date(r[2]),new Date(r[3])]);
    var container = document.getElementById('example5.1');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn({ type: 'string', id: 'Room' });
    dataTable.addColumn({ type: 'string', id: 'Name' });
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows(newAr);

    var options = {
      timeline: { colorByRowLabel: true }
    };

    chart.draw(dataTable, options);
  }

我不知道为什么，但它不起作用

Answer 1

解释：

• 我相信您的目标是创建一个数组，其中第三和第四列是日期对象。

• 您实际上需要将new Date() 应用于数据第三和第四列中的每个元素。

• 您可以使用map() 来实现您的目标：

  const newAr = srcValues.map(r=>[r[0],r[1],new Date(r[2]),new Date(r[3])]);

---

解决方案：

function myFunction() {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const srcSheet = ss.getSheetByName("timeLineData");
  const srcValues = srcSheet.getRange('A2:D'+srcSheet.getLastRow()).getValues();
  const newAr = srcValues.map(r=>[r[0],r[1],new Date(r[2]),new Date(r[3])]);
  Logger.log(newAr)
}

然后你应该能够将该数组传递给dataTable.addRows：

dataTable.addRows(newAr)