[charts] Set barGapRatio by default

[oliviertassinari]

Steps to reproduce 🕹

Link to live example:

Steps:

1. Open https://mui.com/x/react-charts/bars/#basics

Current behavior 😯

Expected behavior 🤔

I don't know about the exact values, but something like this would make more sense to me:

<BarChart
  xAxis={[{ scaleType: 'band', barGapRatio: 0.1, categoryGapRatio: 0.2, data: ['group A', 'group B', 'group C'] }]}
  series={[{ data: [4, 3, 5] }, { data: [1, 6, 3] }, { data: [2, 5, 6] }]}
  width={500}
  height={300}
/>

Context 🔦

• Same for recharts https://recharts.org/en-US/examples/SimpleBarChart

• Same for chartsjs https://www.chartjs.org/docs/latest/samples/bar/stacked-groups.html

• Same for Google Charts https://developers.google.com/chart/interactive/docs/gallery/barchart#dual-x-charts (a slim 1px transparent area, which already feels nice)

Your environment 🌎

v6.0.0-alpha.9