Google表格图表的排序持续时间

时间:2017-01-19 13:05:26

标签: google-visualization

我想按列2(持续时间)降序或升序排序。

这是代码:

https://jsfiddle.net/guilhermelight1/no7xvnLu/13/

#table_div tbody tr td:nth-child(3){
    text-transform: uppercase;
}

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['table']}]}"></script>
       <div id="table_div"></div>
google.setOnLoadCallback(drawTable);

function drawTable() {
     var opts = {sendMethod: 'auto'};
     var query = new google.visualization.Query('https://spreadsheets.google.com/tq?key=1mYtjx7_EP3k888Ep7oU92wk5J24EZn4UWwxKZAkFhHY&sheet=B', opts);

   query.setQuery("select A,B,C ");


  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
    if (response.isError()) {
        alert('Error in query: ' + response.getMessage() + ' ' +             response.getDetailedMessage());
        return;
    }
    var data = response.getDataTable();
    var formatter = new google.visualization.DateFormat({pattern: 'HH:mm'});
    formatter.format(data, 2);


        var table = new google.visualization.Table(document.getElementById('table_div'));

        table.draw(data, {showRowNumber: true});
      }

1 个答案:

答案 0 :(得分:1)

假设小数列代表

以下代码段使用DataView添加计算列以进行排序...

google.charts.load('current', {
  callback: drawTable,
  packages:['table']
});

function drawTable() {
  var opts = {sendMethod: 'auto'};
  var query = new google.visualization.Query('https://spreadsheets.google.com/tq?key=1mYtjx7_EP3k888Ep7oU92wk5J24EZn4UWwxKZAkFhHY&sheet=B', opts);
  query.setQuery("select A,B,C ");
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' +             response.getDetailedMessage());
    return;
  }

  var data = response.getDataTable();
  var formatter = new google.visualization.DateFormat({pattern: 'hh:mm:ss'});
  var timeColumn = 2;
  var viewColumns = [];
  var view = new google.visualization.DataView(data);
  for (var i = 0; i < data.getNumberOfColumns(); i++) {
    viewColumns.push(i);
  }
  viewColumns.push({
    label: data.getColumnLabel(timeColumn),
    type: 'date',
    calc: function (dt, row) {
      var dateValue = new Date();
      dateValue = new Date(dateValue.getFullYear(), dateValue.getMonth(), dateValue.getDate());
      dateValue = new Date(dateValue.getTime() + (dt.getValue(row, timeColumn) * 1000));
      return {
        v: dateValue,
        f: formatter.formatValue(dateValue)
      };
    }
  });
  view.setColumns(viewColumns);

  var table = new google.visualization.Table(document.getElementById('table_div'));
  table.draw(view, {showRowNumber: true});
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="table_div"></div>