Javascript 设置Google折线图的x轴格式

我有一个谷歌折线图，我在这个例子中输入了一些数据：

['Time', 'Temperature'],
['00:00', 5, ],
['01:00', 12, ],
['02:00', 14, ],
['03:00', 18, ],
['04:00', 17, ],
['04:20', 17, ],
['04:30', 18, ],
['04:40', 22, ],
['05:00', 24, ],
['06:00', 20, ],
['07:00', 17, ],
['08:00', 17, ],
['09:00', 16, ],
['10:00', 17, ],
['11:00', 16, ],
['12:00', 15, ]

我想在24小时模式下，x轴只显示一天中的小时数

每小时可以有一个或多个值，但x轴的范围应固定且线性（0-23）

看看小提琴：

如何做到这一点

编辑：

---

实际上，这个问题可以通过在x轴上使用适当的日期对象来解决，并使用

HH:mm

对它们进行格式化。它的工作原理是这样的，这意味着我必须更改日期格式

---

它会像这样工作，这意味着我必须更改日期格式

---

您还可以使用数据类型-->

'timeofday'

--请参阅--第一列中的值需要看起来像-->

[0,0,0]

，

[0,30,0]

，

[1,0,0]

，

[1,30,0]

…谢谢。我还需要几天甚至几个月的时间。遗憾的是，就我目前所知，一个好的旧unix时间戳似乎不可能实现。我还尝试了日期字符串表示法[“date（2017，0，1，1，0，0）”，12]，它也不起作用。。。上述日期字符串仅在使用直接从json创建数据表时有效，而不是在使用

arrayToDataTable

时有效（虽然在提供的示例中未看到）…您还可以使用数据类型-->

'timeofday'

--请参见--第一列中的值需要类似于-->

[0,0]

，

[0,30,0]

，

[1,0,0]

，

[1,30,0]

…谢谢。我还需要几天甚至几个月的时间。遗憾的是，就我目前所知，一个好的旧unix时间戳似乎不可能实现。我还尝试了日期字符串表示法[“date（2017，0，1，1，0，0）”，12]，它也不起作用。。。上述日期字符串仅在使用直接从json创建DataTable时有效，而在使用

arrayToDataTable

时无效（尽管在提供的示例中未看到）。。。

  google.charts.load('current', {
      'packages': ['line', 'corechart']
  });
  google.charts.setOnLoadCallback(drawVisualization);

  function drawVisualization() {
      var data = google.visualization.arrayToDataTable([
          ['Time', 'Temperature'],
          [new Date(2017, 0, 1, 0, 0, 0), 5],
          [new Date(2017, 0, 1, 1, 0, 0), 12],
          [new Date(2017, 0, 1, 2, 0, 0), 14],
          [new Date(2017, 0, 1, 3, 0, 0), 18],
          [new Date(2017, 0, 1, 4, 0, 0), 17],
          [new Date(2017, 0, 1, 4, 20, 0), 17],
          [new Date(2017, 0, 1, 4, 30, 0), 18],
          [new Date(2017, 0, 1, 4, 40, 0), 22],
          [new Date(2017, 0, 1, 5, 0, 0), 24],
          [new Date(2017, 0, 1, 6, 0, 0), 20],
          [new Date(2017, 0, 1, 7, 0, 0), 17],
          [new Date(2017, 0, 1, 8, 0, 0), 17],
          [new Date(2017, 0, 1, 9, 0, 0), 16],
          [new Date(2017, 0, 1, 10, 0, 0), 17],
          [new Date(2017, 0, 1, 11, 0, 0), 16],
          [new Date(2017, 0, 1, 12, 0, 0), 15]
      ]);

      new google.visualization.LineChart(document.getElementById('visualization')).
      draw(data, {
          "height": 500,
          "curveType": "function",
          "lineWidth": 2,
          "pointSize": 2,
          "vAxes": {
              "0": {
                  "title": "°C",
                  "format": "#,##00.00 °C"
              }
          },
          "hAxes": {
              "0": {
                  "title": "Time",
                  "format": 'HH:mm'
              }
          },
          "series": {
              "0": {
                  "targetAxisIndex": 0
              }
          }
      });
  };