javascript - 如何创建过去二十四小时的 Google 面积图

Question

我需要为从现在起过去 24 小时的事件创建一个 Google 区域图。我需要的是

时间以小时为单位，从现在到过去 20 小时。但我无法理解如何为水平值提供时间。另外，如何分别附加 h 和 k 水平和垂直值。我的代码看起来像

 var data = google.visualization.arrayToDataTable([
      ['Hours', 'Activites', 'Responses'],
      ['24',  8000,      400],
      ['16',  1170,      460],
      ['12',  660,       1120],
      ['8',  1030,      540],
      ['4',  1030,      540]
      ['now',  1030,      540]
    ])

    var options = {
      title: 'Company Performance',
      hAxis: {title: 'Hours',  titleTextStyle: {color: '#333'}},
      vAxis: {minValue: 0}
    };

    var chart = new google.visualization.AreaChart(document.getElementById('areachart'));
    chart.draw(data, options);

任何帮助将不胜感激。

Answer 1

对于水平轴很简单，只需放置你想要的标签:

    var data = google.visualization.arrayToDataTable([
      ['Hour', 'Activites', 'Responses'],
      ['-24h',  8000,      400],
      ['-16h',  1170,      460],
      ['-12h',  660,       1120],
      ['-8h',  1030,      540],
      ['-4h',  1030,      540],
      ['now',  1030,      540]
    ])

至于垂直，有点难。您需要将所有格式化数据点除以 1000 并应用格式以显示千的 K。方法如下:

for (var i = 0; i < data.getNumberOfRows(); i++) {
     for(var j=1;j<data.getNumberOfColumns();j++){ 
        var dataPoint = data.getValue(i, j);
        data.setValue(i, j, dataPoint / 1000);
        data.setFormattedValue(i, j, dataPoint.toString());
     }
  }

        var options = {
          title: 'Company Performance',
          hAxis: {title: 'Year',  titleTextStyle: {color: '#333'}},
          vAxis: {minValue: 0},
            vAxis: {format: "#,###k"}
        };

完整工作 fiddle :http://jsfiddle.net/bLv459jz/