如何根据发生次数自定义谷歌时间表图表?

时间:2017-08-29 10:56:36

标签: javascript charts google-visualization

如何根据从高到低的出现次数自定义Google时间线图表?我必须根据发生次数自定义时间线图表。 code link

 dataTable.addRows([
            ['President', 'George Washington', new Date(1789, 3, 30), new Date(1797, 2, 4)],
            ['President', 'John Adams', new Date(1796, 2, 4), new Date(1802, 2, 4)],
            ['President', 'Thomas Jefferson', new Date(1801, 2, 4), new 

Date(1809, 2, 4)],
            ['Vice President', 'John Adams', new Date(1789, 3, 21), new Date(1797, 2, 4)],
            ['Vice President', 'Thomas Jefferson', new Date(1797, 2, 4), new Date(1801, 2, 4)],
            ['Vice President', 'Aaron Burr', new Date(1801, 2, 4), new Date(1805, 2, 4)],
            ['Vice President', 'George Clinton', new Date(1805, 2, 4), new Date(1812, 3, 20)],
            ['Secretary of State', 'John Jay', new Date(1789, 8, 25), new Date(1790, 2, 22)],
            ['Secretary of State', 'Thomas Jefferson', new Date(1790, 2, 22), new Date(1793, 11, 31)],
            ['Secretary of State', 'Edmund Randolph', new Date(1794, 0, 2), new Date(1795, 7, 20)],
            ['Secretary of State', 'Timothy Pickering', new Date(1795, 7, 20), new Date(1800, 4, 12)],
            ['Secretary of State', 'Charles Lee', new Date(1800, 4, 13), new Date(1800, 5, 5)],
            ['Secretary of State', 'John Marshall', new Date(1800, 5, 13), new Date(1801, 2, 4)],
            ['Secretary of State', 'Levi Lincoln', new Date(1801, 2, 5), new Date(1801, 4, 1)],
            ['Secretary of State', 'James Madison', new Date(1801, 4, 2), new Date(1809, 2, 3)]
          ]);

          chart.draw(dataTable);
        };

1 个答案:

答案 0 :(得分:0)

您可以使用group() method查找出现次数

class PersonController {
    static scaffold = Person
}

结果是另一个数据表

然后,您可以按var dataGroup = google.visualization.data.group( data, // data table [0], // group by column(s) [{ // aggregation columns column: 0, type: 'number', aggregation: google.visualization.data.count }] );

降序对数据表进行排序
count

这将为您提供每位总统的点数

请参阅以下工作代码段...

dataGroup.sort([{column: 1, desc: true}]);
google.charts.load('current', {
  callback: drawChart,
  packages:['timeline']
});

function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['President', 'George Washington', new Date(1789, 3, 30), new Date(1797, 2, 4)],
    ['President', 'John Adams', new Date(1796, 2, 4), new Date(1802, 2, 4)],
    ['President', 'Thomas Jefferson', new Date(1801, 2, 4), new Date(1809, 2, 4)],
    ['Vice President', 'John Adams', new Date(1789, 3, 21), new Date(1797, 2, 4)],
    ['Vice President', 'Thomas Jefferson', new Date(1797, 2, 4), new Date(1801, 2, 4)],
    ['Vice President', 'Aaron Burr', new Date(1801, 2, 4), new Date(1805, 2, 4)],
    ['Vice President', 'George Clinton', new Date(1805, 2, 4), new Date(1812, 3, 20)],
    ['Secretary of State', 'John Jay', new Date(1789, 8, 25), new Date(1790, 2, 22)],
    ['Secretary of State', 'Thomas Jefferson', new Date(1790, 2, 22), new Date(1793, 11, 31)],
    ['Secretary of State', 'Edmund Randolph', new Date(1794, 0, 2), new Date(1795, 7, 20)],
    ['Secretary of State', 'Timothy Pickering', new Date(1795, 7, 20), new Date(1800, 4, 12)],
    ['Secretary of State', 'Charles Lee', new Date(1800, 4, 13), new Date(1800, 5, 5)],
    ['Secretary of State', 'John Marshall', new Date(1800, 5, 13), new Date(1801, 2, 4)],
    ['Secretary of State', 'Levi Lincoln', new Date(1801, 2, 5), new Date(1801, 4, 1)],
    ['Secretary of State', 'James Madison', new Date(1801, 4, 2), new Date(1809, 2, 3)]
  ]);

  var dataGroup = google.visualization.data.group(
    data,
    [0],
    [{
      column: 2,
      type: 'date',
      aggregation: google.visualization.data.min
    }, {
      column: 3,
      type: 'date',
      aggregation: google.visualization.data.max
    }]
  );
  dataGroup.sort([{column: 1}]);

  var chart = new google.visualization.Timeline(document.getElementById('chart_div'));
  chart.draw(dataGroup);
}