dc.js barChart bars overlapping

Question

This is my datetime barChart. When I use a fiddle (see here) to try and replicate the issue, it works as intended. NB : The data takes a while (~30sec) to load from github.

Here is the code for the graph :

    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(function(d) {
            if (+d.value>0) {
                return("positive");
            } else {
                return("negative");
            }
        })
    .brushOn(true)
    .elasticY(true)
    .margins({left: 70 ,top: 10, bottom: 30, right: 50})
    .centerBar(true);

Am I missing something obvious here ? If not, any ideas where I should start debugging ? I have spent a fair amount of time on this one and I can't find anything wrong.

EDIT: when I remove the .xUnits instructions, I get very skinny bars but well placed along the axis. That leads me to think that there is something wrong with the calculation of the width of the bars. I don't know how to debug that specific calculation though. If anyone knows, I'll be happy to dig into it.

EDIT2 : The width attribute of the <g class="chart-body"><g class="stack _0"><rect class="bar"></rect></g></g> elements within the svg are all set to a wrong value. If anyone could point me to where this is calculated in the d3 library, I could maybe take it from there.

EDIT3: I found the source of my issue. The width of the bars is incorrect because when calculateBarWidth() has run once to instantiate the graph, it doesn't run anymore even when dc.redrawAll() is called. In my case I successively add chunks of records to my crossfilter and redraw the graphs. The new question is 'How do I force calculateBarWidth() to rerun ?'

Answer 1

.on("preRedraw", function (chart) {
        chart.rescale();
    });
    chart.on("preRender", function (chart) {
        chart.rescale();
    });

The answer comes from here.

Answer 2

I think you are looking for barChart.calculateBarWidth. (src/bar-chart.js if you're considering submitting a PR ;)

There have been other bugs reported against it recently to do with ordinal bar charts:

https://github.com/dc-js/dc.js/issues/533

I don't know if there is also a bug with dates. It seems odd to me that the same code would work in a fiddle but not in your page... that's pretty rare.