echarts icon indicating copy to clipboard operation
echarts copied to clipboard

[Bug] `xAxis.splitArea.interval` function does not color background as expected

Open thehale opened this issue 4 months ago • 4 comments

Version

5.4.3

Link to Minimal Reproduction

https://echarts.apache.org/examples/en/editor.html?c=bar-simple&lang=ts&code=MYewdgzgLgBAFiArgJwjAvDA2gKBjAbxgBMBDKAUwC4YByAJgAZ6AWAWkYEY37PaAaeElQ1OMAL6CA9FJgBlRGDIBPPIRLlqdJqw7d6AZgFCUEGgA4J02QFlwKtUTKUaDZuy48WxhKZoA2KxgZGAAVRAoIB3wnTVcdD30AVh9hMxgAdiCQgHUKYjBI6PVnLTddT3p_VL9MgDpLSWDZULhTYtiXbXc9HgyakRgDbNkAMWQASw6NLvLEnnMB9MY6sSaQuXIUadL4nsqATiXREflFHbjuiu4DRmOYTkZTuyVSVRiZsoTegz5BX0G_jqw3WLQiUTejk-ewq9D09yyoJgeQKRUhH12Vw8cOY93MdSSp1a7XRJUucw4OKM_zSNAOp3GU1JnS--xx3hptTWzXkW2QDgAugBuHA4ABmimAUAm4BgEF8ABtiAAhCgAYRACpAyHyAAoJkoKAAPGhgRAAWwARhRkABKGiWkCaiikMCENQhHVQFBug3EY0wACkMHoGEwjDUXp9MD9AeDWXQiZgTwAPimY4ajUHMmHMIEeQB3CgUADWFCUEBw4lFIAADtLZZgCGojQBBI0TdLN_D4KDKWtlYCaADm2uUAjU-AgtYVEygrZ1pBo3Z7U4QBZoUGQEX4k57BsoyAAbqQFTR9ZnBCeFRFbRgAHxyxUq9Wa7V62NG2271fV_CSNRlHbTtlxgPsB1ca8IloKw1AgG0JkiGhcFXFdV2cJcTFQOpzVIWtdV1OA73QR8sDgOpSn-OoAQgAVvz3Xt-zKS1SGQCdV3wOcKHNOQ-wVLQ0I40AtWQc9OlIABJTMJGIx95SQJVVQ1ES9QwqT_S_GAAH4YAAImHHVlF0mAaF0y0bwoXSGIkPc_xgAUqyFIA

Steps to Reproduce

  1. Open the linked Minimal Reproduction
  2. Observe that both xAxis.splitArea.interval and series.itemStyle.color use the same conditional to control coloring.
  3. Observe that the grey bars do not line up with the light grey backgrounds.
  4. Modify the conditional in shouldBeColored (e.g. swapping which return is commented out) and observe that the discrepancy persists across a variety of conditionals.

Current Behavior

The bars themselves are colored as expected, but the background coloring from splitArea does not match even though both use the same conditional as the bar colors.

For example, in the following image, I was trying to add a background color for the weekends. The bars themselves colored correctly, but the splitArea instead only colored every 7th section.

image

Similarly, attempting to color a specific interval creates bizarre splitArea coloring:

image

Same for attempts to space out the coloring (e.g. 1 off, 4 on, repeating)

image

Expected Behavior

When the xAxis.splitArea.interval function returns true, I expect the area to have a colored background.

In the case of the given example, wherever the bars are colored grey, I expect the splitArea background to also be colored.

Environment

- OS: Windows
- Browser: Microsoft Edge Version 121.0.2277.83 (Official build) (64-bit)
- Framework: n/a (in the browser sandbox) and Vue@3

AND

- OS: Linux (Fedora)
- Browser: Firefox 122.0
- Framework: n/a (in the browser sandbox) and Vue@3

Any additional comments?

No response

thehale avatar Feb 02 '24 20:02 thehale