Limiting x-axis range leads to broken lines

### Expected behavior

We have upgraded chart.js from version 2 to 3 and now the following is not working. To make a single value, which should be displayed as a line, more readable, the value was simply displayed three times and only a section of the x axis was displayed. As a result, a straight line runs completely from left to right through the whole chart.

### Current behavior

When the last data-point is cut off, the line end in the middle of the chart and the areas are beeing dragged down outside of the chart.
[See here an image of the different behaviour](https://i.stack.imgur.com/S7hv6.png)

### Reproducible sample

https://codepen.io/Sue10Bach/pen/eYVmLWE

### Optional extra steps/info to reproduce

_No response_

### Possible solution

I kind of got it to show me the old version when I add another data point like this: [jsfiddle.net](https://jsfiddle.net/Sue10bach/gv6u7ojz/1/) I do not know why that works. Seems buggy like hell.

### Context

_No response_

### chart.js version

3.7.1

### Browser name and version

Chrome

### Link to your project

https://jsfiddle.net/Sue10bach/7q3n6wvb/