Column Stacked Chart

[Satish]

Hi Everyone,
This is my first post in this group and I have been
using Google chart api's for a while now. I would like to know how can
i draw COLUMN STACKED CHART using google chart apis. When i say column
stacked chart i refer to this:

http://peltiertech.com/Utility/pix/clusterstackcolumns.png

I have looked around the google chart apis but could
not find anything which can meet my requirement. Does google chart
api's support this functionality? Is yes, kindly suggest how can I
implement the same.

Thank You

[Matt]

First, goto this Google playground site for bar charts:
http://code.google.com/apis/ajax/playground/?type=visualization#bar_chart

In the editable code, near the very bottom, add:
isStacked: true
So it will look something like this:

new
google.visualization.BarChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
isStacked: true,
vAxis: {title: "Year"},
hAxis: {title: "Cups"}}
);

[Matt]

I originally meant to send you this link, it works there as well for
your column charts.

http://code.google.com/apis/ajax/playground/?type=visualization#column_chart

On Nov 1, 11:38 am, Matt <mhe...@kixeye.com> wrote:
> First, goto this Google playground site for bar charts:http://code.google.com/apis/ajax/playground/?type=visualization#bar_c...

[asgallant]

Matt's post is good if you just want stacked bars, but if you are looking for a cluster-stacked chart (like the one you linked to), that is doable, but requires a bit of hackery to make it happen.

[Satish]

Hi asagallant,
Can you tell me how can i do this.

-Satish

[asgallant]

Basically, there are two techniques at work here:

1) You need to create 1 DataTable column for each data color you want.  Each chart column is its own row in the DataTable: set only the values you want to show in a particular column (everything else should be null).

2) You need to insert rows of null data to create the gaps between grouped columns

See my example code here: http://jsfiddle.net/yRnNk/1/

[ibanhoe]

Hi asgallant

I need something like the example you sent to Satish.

The difference y that i want to show the current value and the percentage that this value represents for the stacked bar. Please see the image attached

Is it possible?

Thanks a lot

[asgallant]

You can do that by manually setting the formatted value of a cell to whatever you want the tooltip to show, ie in your example it would be "1,347.0 entradas, 45%".

[minimoto]

Its old post, but your solution worked for me, thank you for sharing!

[N Lurie]

I need to add a third stack to each column, and now I have 7 data.addColumn clauses, and 7 values in the data.addRow arrays. Any idea why it is note running? I simply grew everything proportionally. Thanks!

[Andrew Gallant]

Can you post example code that demonstrates the problem?