Switching rows / columns in a Area Chart

750 views
Skip to first unread message

Luis Novo

unread,
Jun 5, 2013, 5:08:29 PM6/5/13
to google-visua...@googlegroups.com
Hi ,

When I use an Area Chart on Google Drive, I can select an option to "Switch Rows / Columns". 

Now that I am playing with the Javascript API, I'd like to do the same but couldn't find a way to do it in the documentation. 

Here's the code I am using successfully. All I need is to switch row/column on the API.

<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {


var data = google.visualization.arrayToDataTable([
['data',0,1,2,3,4,5,6]
,['2013-04-14 (336)',064,04,03,02,06,02,02]
,['2013-04-21 (169)',0,028,03,02,04,02,02]
,['2013-04-28 (121)',0,0,027,02,01,02,02]
,['2013-05-05 (101)',0,0,0,020,0,01,0]
,['2013-05-12 (688)',0,0,0,0,0143,017,07]
,['2013-05-19 (3226)',0,0,0,0,0,0642,022]
,['2013-05-26 (321)',0,0,0,0,0,0,082]
]);



var options = {
title: 'Company Performance', isStacked:true,
hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
};

var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>

Can anyone help?

asgallant

unread,
Jun 6, 2013, 11:38:19 AM6/6/13
to google-visua...@googlegroups.com
This does not exist as an option in the API.  You can manually parse your data into a new DataTable with the rows and columns switched; it would work something like this:

var newData = new google.visualization.DataTable();
newData.addColumn('string', 'foo');
for (var i = 0; i < data.getNumberOfRows(); i++) {
    newData.addColumn('number', data.getFormattedValue(i, 0));
}

for (var i = 1; i < data.getNumberOfColumns(); i++) {
    var row = [data.getColumnLabel(i)];
    for (var j = 0; j < data.getNumberOfRows(); j++) {
        row.push({v: data.getValue(j, i), f: data.getFormattedValue(j, i)});
    }
    newData.addRow(row);
}

For this code to work, all of your data (except the first column) must be of the same data type (ie, number in this example), as after the switch, all rows inside a column must be comprised of the same data type.
Reply all
Reply to author
Forward
0 new messages