2

I want to add space between two bars in vertical bar graph using react-chart-js in below image I want to center align all the bars in Bar graph at center by adding some extra space to left and right of all the bars. enter image description here

I tried using:

scales: {
        xAxes: [{
            categoryPercentage: 1.0,
            barPercentage: 1.0
        }]

But this only changes width of bars I want to give spacing on both sides of bars without changing the width of the bars like this: enter image description here

Adam
  • 186
  • 1
  • 4
  • 20
Nimesh s
  • 31
  • 1
  • "1.0 will take the whole category width and put the bars right next to each other." — https://www.chartjs.org/docs/latest/charts/bar.html#barpercentage I wonder if the defaults give you what you want? See the chart at the top of the page I linked to. – Kevin Ashworth Nov 05 '22 at 20:02
  • @KevinAshworth thanks for answering the question , yes I tried playing with barPercentage and categoryPercentage after checking the documentation , but could not obtain the desired output is there any way possible to obtain the desired output . even any idea would be helpful to me. – Nimesh s Nov 06 '22 at 14:50
  • Without more details, I don't know what to say to help you solve your problem. On SO, it's common to provide a minimal working example. Code blocks might be enough. Some use Stack Snippets. But I think codesandbox is a good way to share your code and help others help you. For more, see https://stackoverflow.com/help/minimal-reproducible-example – Kevin Ashworth Nov 07 '22 at 01:39

0 Answers0