javascript - Google 可视化水平轴标签

Question

我正在尝试创建一个折线图，显示全年页面上的点击次数。不过，我只希望水平轴在每个月的第一天显示每月一个标签。我目前有类似的内容，但它只显示第一个月。

view.setColumns([{
  type: 'string',
  label: 'Month',
  calc: function(dt, row) {
    var date = dt.getValue(row, 0).split('/');
    date = new Date(date[2], date[1] - 1, date[0]);
    var current_month = date.getMonth();
    if (current_month > month || (current_month == 0 && month != 0)) {
      month = current_month;
      return months[month];
    } else {
      return null;
    }
  }
}, 1]);

Answer 1

如果您的类别值是 Date() 类型，Google 通常会很好地让它们默认按月显示。请参阅下面的示例:

function drawVisualization() {
  // Create and populate the data table.
  var data = new google.visualization.DataTable();
  data.addColumn('date', 'Date');
  data.addColumn('number', 'Cats');
  data.addColumn('number', 'Dogs');
  data.addColumn('number', 'Rabbits');
  data.addRows([
    [new Date(1990, 0, 5), 1, 1, 0.5],
    [new Date(1990, 1, 10), 2, 0.5, 1],
    [new Date(1990, 2, 15), 4, 1, 0.5],
    [new Date(1990, 3, 20), 8, 0.5, 1],
    [new Date(1990, 4, 25), 7, 1, 0.5],
    [new Date(1990, 5, 30), 7, 0.5, 1],
    [new Date(1990, 6, 5), 8, 1, 0.5],
    [new Date(1990, 7, 10), 4, 0.5, 1],
  ]);

  // Create and draw the visualization.
  new google.visualization.LineChart(document.getElementById('visualization')).
    draw(data, null);
}

如果您的第一列没有存储为日期，而它们只是值，那么我建议将它们转换为日期，以便让 Google 为您完成这项艰苦的工作。