Фильтрация визуализации Google «таблицы» по нажатию кнопки (без ControlWrapper) - PullRequest
0 голосов
/ 02 апреля 2019

Я бы хотел отфильтровать «табличную диаграмму» визуализации Google, нажав кнопку (это нельзя сделать правильно с помощью элементов управления , которые Google предоставляет ).Например: использование средства выбора даты и времени для фильтрации по временному диапазону (я знаю, что есть DateRangeFilter, но это не очень удобно).Я нашел способ, но он кажется избыточным / не очень чистым.

Мой DataTable содержит только строки, поэтому сначала мне нужно создать DataView, связывающий соответствующие типы данных для моих фильтров (я использую глобальные переменные для представления,тест и т. д. - если у вас есть идея получше, просто скажите мне!):

  // Create my data table.
  var dataTable = google.visualization.arrayToDataTable(csv, false);

  var columns = [{
    type: 'datetime',
    label: dataTable.getColumnLabel(0),
    calc: function (dt, row) {
        var val = dt.getValue(row, 0).split(' ');
        var date = val[0].split('-');
        var time = val[1].split(':');
        //could have used moment.js but I know the exact format and it will never change
        return new Date(date[2],(date[1] - 1),date[0],time[0],time[1])
    }},
    1,
    {
    type: 'number',
    label: dataTable.getColumnLabel(4),
    calc: function (dt, row) {
        var val = dt.getValue(row, 4);
        return (val != '' && val != null) ?new Number(val).valueOf() : null;
    }
  }];

  //this create my DataView, everything's alrigth  
  view = new google.visualization.DataView(dataTable);
  view.setColumns(columns);

После этого я выполняю некоторую группировку и рисую свою таблицу:

   test = google.visualization.data.group(view, [{
        column: 1,
        label: 'hashtags',
        type: 'string'
    }], [{
        column: 2,
        label: 'score',
        aggregation: google.visualization.data.sum,
        type: 'number'
    }]
    );

  table = new google.visualization.Table(document.getElementById('table_div'));
  table.draw(test, {showRowNumber: true, width: '100%', height: '100%', page: 'enable', pageSize: 10});

И, наконец,вот что я делаю, когда пользователь нажимает на кнопку:

  $("#test").click(function() {
    //Just a test case with one date
    view.setRows(view.getFilteredRows([{column: 0, maxValue: new Date(2019,2,16)}]));

   test = google.visualization.data.group(view, [{
        column: 1,
        label: 'hashtags',
        type: 'string'
    }], [{
        column: 2,
        label: 'score',
        aggregation: google.visualization.data.sum,
        type: 'number'
    }]
    );
    table.draw(test,{showRowNumber: true, width: '100%', height: '100%', page: 'enable', pageSize: 10});
  });

Действительно ли мне нужно перегруппировать и перерисовать?Есть ли лучшее решение?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...