javascript - 具有固定间隔的谷歌可视化折线图

Question

我正在使用 Google Chart 绘制折线图来绘制一段时间内整数的变化。这是我正在使用的代码:

  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
data.addColumn('datetime', 'Time');
data.addColumn('number', 'Leads');
data.addRow([new Date(1377011402000),5]);     
data.addRow([new Date(1376967661000),12]);
//for full data see http://ubuntuone.com/3NMEtWYkhQSCHx4RERVcgq
                 

    var options = {
      title: 'Company Performance',
          fontSize: '12px',
          curveType: 'function',
          pointSize: 5,
          hAxis: {title: 'Week Report',
                  titleTextStyle: {color: '#FF0000'}
                  },
          vAxis: {title: 'Leads',  
                  titleTextStyle: {color: '#FF0000'}}
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }

现在，这就是图表当前的样子

如果你试图理解这一点，你会发现它没有意义。那么 Google Chart Visualization 中有一种方法可以用来指定 x 轴间隔吗？例如我希望 x 轴为(800-900 小时到 2300-00 小时)。所以只绘制了一条 1line 而不是当前的多条线？

这是实时页面: http://ubuntuone.com/3NMEtWYkhQSCHx4RERVcgq

Answer 1

除了对数据进行排序之外，听起来您还想使用 timeofday 类型的值，至少记录在:https://google-developers.appspot.com/chart/interactive/docs/reference?hl=en#DataTable_getValue

您应该能够使用如下值:

data.addColumn('timeofday', 'Time');
data.addColumn('number', 'Leads');
data.addRow([[0, 0, 0, 1377011402000],5]);     
data.addRow([[0, 0, 0, 1376967661000],12]);