[Bug] MarkArea not fully fixed in version 5.4.2

[ily-salamat]

Version

5.4.2

Link to Minimal Reproduction

https://codepen.io/ily-salamat/pen/bGmVjGj

Steps to Reproduce

I already opened this issue here #18130 and it's fixed in this PR #18229 and apparently it's not fully fixed because now there is a gap issue between bars and mark area

In 5.4.0 version works fine
See example: https://codepen.io/ily-salamat/pen/LYBZzNo

Now in 5.4.2 there is a gap issue
See example: https://codepen.io/ily-salamat/pen/bGmVjGj

Current Behavior

Since version 5.4.2 there is a gap between bars and mark area

Expected Behavior

MarkArea should works properly as in the previous version

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[helgasoft]

@ily-salamat, just adding a simplified update of your demo.
Unwanted markArea overlaps show as darker red stripes on auto-expanding zoom.

[ozkoidi]

It's been 3 months since the last comment. Any news on this? This is a regression (see #18130) and it should be fixed. The current status blocks us from using the latest versions

[plainheart]

@ozkoidi Apologies for this blocker. I've confirmed it is a bug that wasn't fixed by #18229 and will fix it soon.

[plainheart]

@ozkoidi After a simple dig, I think it's not a "bug" in this case. #17098 & #18229 (#18229 (comment)) make the markArea include the whole category, instead of starting from and ending at the center of the bar. It's the reason why the mark areas overlap. If the previous behavior is expected to be reserved, a new option (like markOrigin?) might be needed.

BTW, there seems to be another potential bug when the axisTick.alignWithLabel is set as true. See this demo for reproduction.

cc: @Ovilia @jiawulin001

[Chewieez]

I am also seeing the bug that @plainheart referred to at the end of their comment with axisTick.alignWithLabel in 5.4.3.

I was able to work around it by attaching my markArea to a 2nd xAxis that has axisTick.alignWithLabel = false, while my first xAxis has it set to true.