How to keep data in view when using 'controlType': 'StringFilter' on a Table?
I generate data using Python and calculate the right table heigth using 50+(tableRows*50). Some table contain 100+ rows -> adding the 'controlType': 'StringFilter' is great. However, the remaining rows (almost) disappear from the user view after filtering. This also happens if I use height 100% in a large div. I unfortunately cannot reproduce the automatic resizing that occurs in this example <https://google-developers.appspot.com/chart/interactive/docs/gallery/controls_5acf2d3acecb46a3bc89048a2c4e7be2.frame?hl=nl>. Please advice how to avoid this? E.g. can I align the filtered data to the top (currently it is vertically centered). Or can I set table height based on the number of rows? I like this example <https://developers.google.com/chart/interactive/docs/drawing_charts> where the option is set based on an own var, but it does not seem to work for the dashboard (because the options are already set, unlike the chart.draw(data, options) that happens after ?) This is what I tried, I would really appreciate your help, I am learning by doing :) function tabelGemeenteOverzicht() { var tableHeight = '8000'; var dashboard = new google.visualization.Dashboard( document.getElementById( 'dashboard-gemeente-wijken-buurten-overzicht')); var data = google.visualization.arrayToDataTable([ ['Naam', 'Regio', 'Actief', 'Informatie periode', 'Aantal<br>inwoners'], {{ .Params.gemeenteoverzicht | safeJS }} ]); var control = new google.visualization.ControlWrapper({ 'controlType': 'StringFilter', 'containerId': 'filter-gemeente-wijken-buurten-overzicht', 'options': { 'filterColumnLabel': 'Naam', 'matchType': 'any'} }); var table = new google.visualization.ChartWrapper({ 'chartType': 'Table', 'containerId': 'tabel-gemeente-wijken-buurten-overzicht', 'options': {'height': tableHeight, 'width': '100%', 'allowHtml': true, 'showRowNumber': false} }); dashboard.bind(control, table); google.visualization.events.addListener(dashboard, 'ready', heightHandler) dashboard.draw(data); } ; function heightHandler() { var tableRows = table.getDataTable().getNumberOfRows(); var tableHeight = 50+(tableRows*50); } -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/eba52fcb-c3c5-4986-9b45-0dc1beaa7d70%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
