按年DESC显示谷歌图表日历

Khr*_*rys 5 jquery google-visualization

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

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

如何实现这一目标?谢谢.

Cha*_*ton -2

这并不完全是一个理想的解决方案,但如果您有兴趣,如果您愿意在数据中反转年份值,则可以手动反转图表中的年份值。就像这样:

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];
  }
}
Run Code Online (Sandbox Code Playgroud)

JSFiddle

输出:

在此输入图像描述