dc.js charts not linked - d3.js

Question

I have two barCharts exactly equivalent except for the .brushOn option :
pnlPerDaybarChart
.height(300)
.width(700)
.dimension(dims.date)
.group(groups.date.pnlSum)
.valueAccessor(function(d) {
return Math.abs(d.value);
})
.renderTitle(false)
.x(d3.time.scale().domain([minDate,maxDate]))
.xUnits(d3.time.days)
.colors(colorChoice)
.colorAccessor(colorAccessorPosNeg)
.brushOn(false)
.elasticY(true)
.margins({left: 70 ,top: 10, bottom: 30, right: 50})
.centerBar(true);
pnlPerDaybarChartBrush
.height(100)
.width(700)
.dimension(dims.date)
.group(groups.date.pnlSum)
.valueAccessor(function(d) {
return Math.abs(d.value);
})
.renderTitle(false)
.x(d3.time.scale().domain([minDate,maxDate]))
.xUnits(d3.time.days)
.colors(colorChoice)
.colorAccessor(colorAccessorPosNeg)
.brushOn(true)
.elasticY(true)
.margins({left: 70 ,top: 10, bottom: 30, right: 50})
.centerBar(true);
They render the way I expect but when I use the brush on pnlPerDaybarChartBrush, dc.js doesn't update the other one.
Also, clicking on a bar in pnlPerDaybarChart doesn't modify pnlPerDaybarChartBrush rendering (or any of the other charts on the webpage).
Is this the expected behaviour ?
What I was expecting is :
when I click on a single day in the chart without brush it
automatically renders all charts with data for that specific day.
when I use the brush it also renders the filtered chart without brush
Here is the jsFiddle

Answer 1

It doesn't look like dc.js bar charts support click-to-filter by default. The brush function is expected to be the way you filter a bar or line chart (but as you've discovered, it has its own complications).
If your data is too dense to filter it precisely with the brush, one option would be to allow the user to zoom in on the range chart with mouse or touch events:
http://jsfiddle.net/r4YBS/4/
The only change is adding
.mouseZoomable(true);
at the end of the definition of the brushable bar chart.
Alternately you could implement a custom click listener, which then calls the .filter() method directly.

Answer 2

Fiddle for your requirement.
You are of course right.
.rangeChart is the property you'd need to use it.
Hope it helps.