codesuki / react-d3-components

D3 Components for React
http://codesuki.github.io/react-d3-components/example.html
MIT License
1.63k stars 206 forks source link

Width of each bar in groupedBars #122

Open psudeepta opened 7 years ago

psudeepta commented 7 years ago

@codesuki Is it possible to set the width of each bars in groupedBars? Irrespective of data, I would like to set specific width to each bar. Could you please help me with this?

codesuki commented 7 years ago

I'll have a look at it when I am back at work. Off the top of my head I am not sure how to do it. Have to look at the code.

codesuki commented 7 years ago

I just checked. With CSS is doesn't seem possible. You would have to change the code (maybe send a pullreq?). https://github.com/codesuki/react-d3-components/blob/master/src/BarChart.jsx#L53 If BarChart would have a property barWidths that is an array of doubles [0.1, 0.2, ...] that sum up to 1.0. Then we could change the calculation width={xScale.rangeBand() / data.length} to width={xScale.rangeBand() * barWidths[i]}. That should work. Just a first idea though.