Bar chart overlapping bars and empty spaces when using Object data structure

### Expected behavior

I'm displaying data from two datasets in a bar chart, using object data structure (x and y).

- When only one of the datasets has a row for a certain x value, I expect to see only one bar for this x value, and no empty space next to it.
- When both datasets have a row for a certain x value, I expect to see two bars for this x value.

### Current behavior

- in the first case, sometimes (I can't tell when exactly, since it doesn't happen for all x values, see attached sample) there is an empty space when there shouldn't be. (see column "2010" in the attached sample)
- in the second case, sometimes bars overlap (see column "564" in the attached sample)

I have also asked a question on Stackoverflow [here](https://stackoverflow.com/questions/76523739/how-can-i-hide-missing-or-null-bars-in-a-chart-js-bar-chart), as I wasn't sure this was a bug.

### Reproducible sample

https://codepen.io/marcfal/pen/yLQaxJO

### Optional extra steps/info to reproduce

_No response_

### Possible solution

_No response_

### Context

_No response_

### chart.js version

v4.3.0

### Browser name and version

Chrome 114.0.5735.134

### Link to your project

_No response_