DC.js Composite chart Align points of Line chart in center of bars

Question

I am trying to create a composite chart and my requirements are to draw a bar chart, a line chart and a dotted line chart. For that I draw a composite chart. Now I am having pro

Answer 1

I can't explain why this works, but with some odd combination of range bands and old-style .gap(1), I was able to get it to draw properly.

The trick is

        ._rangeBandPadding(1)

on the composite chart, and

        .gap(1)
        .centerBar(true)

on the child bar chart, pretty much as stated in the original question. So this is essentially a duplicate of the earlier question and answer, but I've applied it to your JSFiddle in this fork:

http://jsfiddle.net/gordonwoodhull/nr0rgzvc/22/

Also, it's important not to set barPadding for the child bar chart. So we are using range-band layout for the composite, and classic gap-padding for the bar chart, which sounds like a very bad idea... but the output looks okay!