Count number of rows after filter in Google Visualisation Table

Question

I have implement various controls in a Google Visualisation Table for multiple filter: CategoryFilter, StringFilter and NumberRangeFilter like this exemple http://jsfiddle.net/asgallant/Ena84/

Is it possible know the number of rows visualised in table after every filter settings? Thank you.

function drawTable() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Name');
data.addColumn('string', 'Team');
data.addColumn('string', 'Nationality');
data.addColumn('number', 'Height');
data.addColumn('number', 'Weight');
data.addColumn('number', 'OverallRating');
data.addColumn('string', 'Foot');
data.addRows([
    ['MESSI','FC BARCELONA','ARGENTINA',169,67,25,'Left foot'],
    ['A. INIESTA','FC BARCELONA','SPAIN',170,65,28,'Right foot'],
    ['XAVI','FC BARCELONA','SPAIN',170,68,32,'Right foot']
]);

var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard'));

var stringFilter = new google.visualization.ControlWrapper({
    controlType: 'StringFilter',
    containerId: 'string_filter_div',
    options: {
        filterColumnIndex: 0
    }
});

var numberRangeFilter = new google.visualization.ControlWrapper({
    controlType: 'NumberRangeFilter',
    containerId: 'numnber_range_filter_div',
    options: {
        filterColumnIndex: 5,
        minValue: 0,
        maxValue: 100,
        ui: {
            label: 'Overall Rating'
        }
    }
});

var table = new google.visualization.ChartWrapper({
    chartType: 'Table',
    containerId: 'table_div',
    options: {
        showRowNumber: true
    }
});

dashboard.bind([stringFilter, numberRangeFilter], [table]);
dashboard.draw(data);
}
google.load('visualization', '1', {packages:['controls'], callback: drawTable});

Answer 1

once the 'ready' event fires on any of the controls, charts, or dashboard

you can use the getDataTable method on any of the controls or charts

to getNumberOfRows

see following working snippet...

function drawTable() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Name');
  data.addColumn('string', 'Team');
  data.addColumn('string', 'Nationality');
  data.addColumn('number', 'Height');
  data.addColumn('number', 'Weight');
  data.addColumn('number', 'OverallRating');
  data.addColumn('string', 'Foot');
  data.addRows([
      ['MESSI','FC BARCELONA','ARGENTINA',169,67,25,'Left foot'],
      ['A. INIESTA','FC BARCELONA','SPAIN',170,65,28,'Right foot'],
      ['XAVI','FC BARCELONA','SPAIN',170,68,32,'Right foot']
  ]);

  var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard'));

  var stringFilter = new google.visualization.ControlWrapper({
      controlType: 'StringFilter',
      containerId: 'string_filter_div',
      options: {
          filterColumnIndex: 0
      }
  });

  var numberRangeFilter = new google.visualization.ControlWrapper({
      controlType: 'NumberRangeFilter',
      containerId: 'numnber_range_filter_div',
      options: {
          filterColumnIndex: 5,
          minValue: 0,
          maxValue: 100,
          ui: {
              label: 'Overall Rating'
          }
      }
  });

  var table = new google.visualization.ChartWrapper({
      chartType: 'Table',
      containerId: 'table_div',
      options: {
          showRowNumber: true
      }
  });

  dashboard.bind([stringFilter, numberRangeFilter], [table]);
  
  google.visualization.events.addListener(dashboard, 'ready', function () {
    // get number of rows
    console.log(table.getDataTable().getNumberOfRows());
  });
  
  dashboard.draw(data);
}
google.load('visualization', '1', {packages:['controls'], callback: drawTable});

<script src="https://www.google.com/jsapi"></script>
<div id="string_filter_div"></div>
<div id="numnber_range_filter_div"></div>
<div id="table_div"></div>