NVD3.js multiChart x-axis labels is aligned to multiple lines, but not multiple bars

Question

This question relates to NVD3.js multiChart x-axis labels is aligned to lines, but not bars

I am using NVD3.js multiChart to show multiple lines

Answer 1

I encountered the same problem and fixed it with below code:

at lines 7832 and 7878 replace

.attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })

with :

var w = (x.rangeBand() / (stacked && !data[j].nonStackable ? 1 : data.length));
var sectionWidth = availableWidth/(bars.enter()[0].length - 1);
if(bars.enter().length == 2)
    return 'translate(' + ((i-1)*w + i*w + (i*(sectionWidth - 2*w))) + ',0)';
else
    return 'translate(' + ((i-0.5)*w + i*(sectionWidth - w)) + ',0)';

The first case handles multiple bars case while the second one handles single bar case.