按年DESC显示谷歌图表日历

Question

我正在使用Google日历图表，我想先显示2015年图表，然后再显示2014年，2013年等等。

在google的示例中：https://developers.google.com/chart/interactive/docs/gallery/calendar没有选项可以执行此操作，即使我按此顺序放置数据。

如何实现这一目标？感谢。

Answer 1

这不是一个理想的解决方案，但如果您感兴趣的话，如果您愿意在数据中反转它们，您可以手动反转图表中的年份值。像这样：

google.load("visualization", "1.1", {
  packages: ["calendar"]
});

google.setOnLoadCallback(drawChart);

function drawChart() {

  var dataTable = new google.visualization.DataTable();
  dataTable.addColumn({type: 'date'});
  dataTable.addColumn({type: 'number'});

  dataTable.addRows([
    [new Date(2012, 1, 1), 1],
    [new Date(2013, 1, 1), 2],
    [new Date(2014, 1, 1), 3],
    [new Date(2015, 1, 1), 4]
  ]);

  var chart = new google.visualization.Calendar(document.getElementById('calendar_basic'));
  var options = {};

  google.visualization.events.addListener(chart, 'ready', swapYears);
  chart.draw(dataTable, options);
}

// important code, this would be simpler w/ jQuery but here's pure JS
function swapYears() {
  var yearTexts = document.querySelectorAll('[font-size="50"]');

  var years = [];
  yearTexts.forEach(function(text) {
    years.push(text.innerHTML);
  });
  years.reverse();

  for (var i = 0; i < yearTexts.length; i++) {
    yearTexts[i].innerHTML = years[i];
  }
}

JSFiddle

输出：