Skip to content

[Bug] right y-axis min/max values are wrong unless zoom is applied, when min/max are supplied #21408

@filip-707

Description

@filip-707

bug-report.html

Image

Version

5.x, 6.0.0

Link to Minimal Reproduction

https://jsfiddle.net/us36p2Lk/1/

Steps to Reproduce

see https://jsfiddle.net/us36p2Lk/1/ (or attacheded bug-report.html file)

See empty chart. All y-axis are ok
All y-axis have their "min/max" set. There is no calculation needed.

Notice y-axis on the right 'axis_300', it is the second y-axis on the right
Its min/max are set to -300/300

At the bottom of chart, there is a listbox,
You can choose signal(s) to be added to the chart (it adds 1 or more series to chart)

When a serie is added, the 'axis_300' min/max becomes -100/100
The values -100/100 happens to be left y-axis (axis_100) min/max

To clearly see the zoom effect, add signal C which is linked to 'axis_300',
Data is displayed accordinging to y-axis -100/100 value.
Zoom in / out, see the effect on the y-axis value and on the data displayed

When a zoom is applied (using mouse scroll, or programmatically), y-axis 'axis_300' min/max are restored to 300.

The y-axis options are built first and never modified
The code which add series to chart, does not modify option.y-axis.

I expect y-axis 'axis_300' min/max to remain -300/300.

it seems y-axis[2] uses y-axis[0] min/max "temporarily". And it only happens if a "right" y-axis has min/max larger than left axis min/max

I tried to move 'axis_300' to the left, and this behavior does not occur.

Current Behavior

When a serie is added, the 'axis_300' min/max becomes -100/100, but min/max are set to -300/300 respectively

When a zoom is applied (using mouse scroll, or programmatically), thee y-axis 'axis_300' min/max are restored to -300/300.

Expected Behavior

The code which add series to chart, does not modify option.y-axis.

I expect y-axis 'axis_300' min/max to remain -300/300.

Environment

- OS: windows 11
- Browser: Edge 142.0.3595.94 & Chrome 142.0.7444.176
- Framework: pure html + css

Html + css + js generated to simplify debugging, problem observed in a more complex environment.

Any additional comments?

I can see that it happens only to right y-axis 'axis_300' which min/max are greater than left y-axis min/max (-100/100).

Also, when zoom is applied, echart corrects the problem automatically, which means the underlying min/max is set correctly.

I tried to move 'axis_300' to the left, and this behavior does not occur. But this does not fit my needs.

Right now, as a workaround, I dispatch a zoom action, to the current zoom percentage (so it does not really zoom),
but forces echart to display proper y-axis[2]. It looks weird because the series tied to axis[2] move to follow y-axis[2] as it changes its min/max.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugenThis issue is in EnglishpendingWe are not sure about whether this is a bug/new feature.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions