how to develop grouped stack bar chart using crossfilter and dc.js

1
votes

Grouped Stacked bar chart(Sample) 

stackedbarchart.width(460)
                .height(250)
                .margins({top: 5, right: 5, bottom: 20, left: 10})
                .dimension(stackedbarchartDimension)
                .group(stackedbarchartGroup)
                .stack(stackedbarchartGroup_stack)
                .stack(stackedbarchartGroup_stack2)
                .x(d3.scale.ordinal())
                .xUnits(dc.units.ordinal)

Please, Post any working example for 'Grouped stacked bar' chart using dc.js.

1
dc.jscrossfilter
Hi @Ashutosh, sorry but this is the wrong kind of question for SO. I removed a couple of vague tags that are likely to bring wrath and down/close votes. I'm not sure what you mean by "passing numeric value" - those methods take a group and an optional name and accessor as arguments. There are at least one or two examples of stacked bar on the site. – Gordon
I'm sure you can find many more examples - just google dc.js stacked bar! – Gordon
@Gordon Thanks for your reply. But, i don't need Stacked bar chart needed Grouped stacked bar chart. Sample screen-shots, i have added and edited question. please, check and share any working example for Grouped stacked bar chart. – Ashutosh Kumar Sharma
Got it - that does make sense as an SO question then, although it's not too hard to search and find the answer I gave below. – Gordon

1 Answers

0
votes

This isn't part of the core library yet, but there is an active pull request which you can use:

https://github.com/dc-js/dc.js/pull/1459

There is a built version on a branch, so if you are using npm, you can specify the dependency

"dc": "git://github.com/dc-js/dc.js.git#grouped-stacked-3",

Or just clone the repo and use the grouped-stacked-3 branch.

The branch contains these examples:

web/examples/bar-grouped-multi.html
web/examples/bar-grouped.html

EDIT: That's wild, I see it still doesn't have an example of grouped+stacked bars. I'll see if I can fix that; until then I think this plunkr is the best example

grouped stacked