How to add space between columns in a grouped bar chart in a multibyte chart with nvd3?

Question

I am trying to add a space / pad for a nvd3 multibyte chart. "groupSpacing" is not what I need, as it only adds space between groups. I need a space between each bar within the group. I found one link in github support . Can you post any solution or customize?

I also found an example of a d3 grouped histogram . Any help in this example is also very helpful to me.

Thank.

Answer 1

I have a d3 group barcode:

fiddle

, 56:

var groupSpacing = 6;

, :

var barsEnter = bars.enter().append('rect')
                .attr('class', 'stm-d3-bar')
                .attr('x', function(d,i,j) {
                    return (j * x1.rangeBand() );
                })
                .attr('y', function(d) { return y(d.y); })
                .attr('height', function(d) { return height - y(d.y); })
                .attr('width', x0.rangeBand() / barData.length - groupSpacing )
                .attr('transform', function(d,i) { 
                  return 'translate(' + x0(d.x) + ',0)'; 
                })
                .style("fill", function(d, i, j) { 
                  return color(data[j].key); 
                });

, , d3.