PDA

View Full Version : stacked to 100% chart



pink_sat
6 Aug 2013, 3:41 AM
What should i do in order to make a stacked to 100% bar or column chart? With the property "stacked: true", i can make a stacked chart,but how to make the columns or bars stacked to 100%?

fschaeffer
6 Aug 2013, 9:52 PM
Hmmm.

If you have a look at the examples at [1] you will see how to create a stacked bar chart. If you want them to be stacked to 100% you will have to provide the percentages in your store data and not the values. So you will have to calculate the ratio in your backend service and then simply push the result to the store.

E.g your chart would display the number of cups (tea, coffee, milk) consumed on sencha con.

Cups Tea = 123
Cups coffee = 543
Cups milk = 42

Then you'll have to calculate the percentage ratio:

Cups Tea = 100 * 123 / (123 + 543 + 42) = 17.37%
Cups Coffee = 100 * 543 / (123 + 543 + 42) = 76.7%
Cups Milk = 100 * 42 / (123 + 543 + 42) = 5.93%

So you data would contain the percentages and additionally the absolute numbers (so you could use them as labels if you like)

[1] http://docs.sencha.com/extjs/4.2.1/#!/example/charts/StackedBar.html

pink_sat
6 Aug 2013, 11:45 PM
Thank you.
Thats's what i did.