jesco-absolut opened a new pull request, #21657:
URL: https://github.com/apache/echarts/pull/21657
<!-- Please fill in the following information to help us review your PR more
efficiently. -->
## Brief Information
This pull request is in the type of:
- [x] bug fixing
- [ ] new feature
- [ ] others
### What does this PR do?
Fixes `markArea` band positioning on inverted category axes.
### Fixed issues
- #21652: `markArea` on a horizontal bar chart with `yAxis.inverse: true`
renders one category band off.
## Details
### Before: What was the problem?
For a horizontal bar chart with an inverted category axis:
```js
yAxis: { type: 'category', inverse: true }
markArea: { data: [[{ yAxis: 0 }, { yAxis: 0 }]] }
```
the `markArea` for the first category rendered on the second category, while
`markLine` at the same `{ yAxis: 0 }` value rendered on the correct first
category.
The root cause was that `fixOnBandTicksCoords` expanded category tick
coordinates to band boundaries using a positive `bandWidth`, assuming
coordinates increase as tick values increase. On inverted axes, the coordinate
extent is reversed, so the half-band boundary shift moved in the wrong
direction.
### After: How does it behave after the fixing?
`markArea` and `markLine` now cover the same category for both normal and
inverted category axes.
The fix makes the on-band tick boundary step follow the axis coordinate
direction:
- normal extent: use `+bandWidth`
- inverted extent: use `-bandWidth`
A visual regression case was added to `test/bar-markArea.html` with normal
and inverted horizontal bar charts. The test overlays a red `markLine` at `{
yAxis: 0 }` so the blue `markArea` can be verified against the same category.
## Document Info
One of the following should be checked.
- [x] This PR doesn't relate to document changes
- [ ] The document should be updated later
- [ ] The document changes have been made in apache/echarts-doc#xxx
## Misc
### Security Checking
- [ ] This PR uses security-sensitive Web APIs.
<!-- PLEASE CHECK IT AGAINST:
<https://github.com/apache/echarts/wiki/Security-Checklist-for-Code-Contributors>
-->
### ZRender Changes
- [ ] This PR depends on ZRender changes (ecomfe/zrender#xxx).
### Related test cases or examples to use the new APIs
`test/bar-markArea.html`
### Merging options
- [x] Please squash the commits into a single one when merging.
### Other information
Validation run locally:
```sh
npm run checktype
npx eslint src/coord/Axis.ts
git diff --check
```
I also verified the reported repro with SVG SSR before and after the fix:
- before: the inverse-axis `markArea` polygon covered the second band while
`markLine` stayed on the first band
- after: the inverse-axis `markArea` polygon covers the first band and
aligns with `markLine`
`
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
