using Table within a chart based dashboard

52 views
Skip to first unread message

laurent coudurier

unread,
Jan 14, 2013, 7:58:37 AM1/14/13
to google-visua...@googlegroups.com
Hi,

This msg is more a feature request (or a bug report) ;-) ... here's the facts :

consider a simple dashboard using a LineChart controled by a ChartRange (or anything else)
it can be very useful to have, in a Table below, some additional content, driven by the same controler, just like this :
bind(range, [chart, table]) ... and it works very nice !

but the table is displaying all the columns (including the tooltips, annotation, scope roles ...) : in the real world, it's not convenient.

having an option to display only some columns in the Table would be useful !!

Best regards
Laurent

asgallant

unread,
Jan 14, 2013, 12:59:30 PM1/14/13
to google-visua...@googlegroups.com
You can do that.  Set the view.columns parameter of the table's ChartWrapper.  This parameter accepts an array of column indices or objects describing calculated columns, the same as the DataView#setColumns method.

laurent coudurier

unread,
Jan 14, 2013, 3:42:16 PM1/14/13
to google-visua...@googlegroups.com
argh, I don't have the reflex to use ChartWrapper instead of classes ! :-(
I'm a beginner, sorry.

thank you so much for your help !

asgallant

unread,
Jan 14, 2013, 5:40:58 PM1/14/13
to google-visua...@googlegroups.com
If you are using a Dashboard, you are using ChartWrappers  >;o)

Changing from one to the other is very easy:

// these two methods create the exact same line chart
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {
      height: 400,
      width: 600
});
  
var wrapper = new google.visualization.ChartWrapper({
    chartType: 'LineChart', // this string is the same as the chart type in "google.visualization.<chart type>"
    containerId: 'chart_div', // pass the same id here that you would pass to document.getElementById
    dataTable: data, // the DataTable/DataView to use for drawing the chart; omit this when using a Dashboard
    options: {
        // put the same options in here that you would when calling chart.draw
        height: 400,
        width: 600
    },
    view: {
        // you can specify which rows/columns to include in the chart here, using the "rows" or "columns" properties
    }
});
wrapper.draw();

Personally, I prefer ChartWrappers, as they store the chart parameters in the wrapper so you don't have to keep track of them separately.  If you want to have your table display a limited set of columns, set the view.columns parameter in the table's wrapper, like this:

view: {
    columns: [0, 1, 3, 6] // use columns 0, 1, 3, and 6 to draw the table
Reply all
Reply to author
Forward
0 new messages