Skip to content

[Feature] [axis] add alignTicks for mutliple axis alignment.#16300

Merged
pissang merged 7 commits intonextfrom
axis-align
Dec 30, 2021
Merged

[Feature] [axis] add alignTicks for mutliple axis alignment.#16300
pissang merged 7 commits intonextfrom
axis-align

Conversation

@pissang
Copy link
Copy Markdown
Contributor

@pissang pissang commented Dec 29, 2021 •
edited
Loading

Brief Information

This pull request is in the type of:

  • bug fixing
  • new feature
  • others

What does this PR do?

This PR adds alignTicks option to allow ticks alignment between multiple value or log axis.

Similar PR: #13210

How it Works

When a value/log axis is set to alignTicks: true. It will find the first value/log axis on the same dimension that is not use alignTicks and align the ticks to it.

The align algorithm is bacially from radar series, which already has ticks alignment between multiple indicator axes, with some enhancement on the corner cases. The simple idea is find a good interval that having minimal extent that can contain the data. Here is a detail explaination

  1. Get the ticks number of axis align to. The splitNumber is ticksNumber - 1
  2. Calculate extent and interval with this splitNumber using calcNiceExtent.
  3. The calculated ticks number is not excatly same to the target number. So we need an extra refine step, the refine step will consider four cases:
    • If min and max are both fixed. It will simply calculate the interval by (max - min) / splitNumber
    • If max is fixed. Try to calculate min by max - interval * splitNumber. interval is from the second step. If the calculated min is larger than the minimal value. Increase interval util min is less than the minimal value.
    • If min is fixed. Similar to max fixed case.
    • If both min and max are not fixed. Set max to extent[1] calculated from the second step. Then it's similar to the max fixed case. Note if the calculated min and max cross the zero value. We need to check if the data extent cross and make sure they are both positive or negative.
  4. If the axis align to has set min or max. We need to adjust the calculated min and max proportionally.

Limitations

  1. Time axis is not supported yet because the ticks calculation has becoming really complex since 5.0
  2. Using alignTicks with complex min, max value, e.g. 'dataMin', 'dataMax', will lead to unreadable ticks.

Fixed issues

#11390
#10928

Details

Before: What was the problem?

image

After: How is it fixed in this PR?

image

More conformance tests

image

Misc

  • The API has been changed (apache/echarts-doc#xxx).
  • This PR depends on ZRender changes (ecomfe/zrender#xxx).

Related test cases or examples to use the new APIs

N.A.

Others

Merging options

  • Please squash the commits into a single one when merging.

Other information

@echarts-bot
Copy link
Copy Markdown

echarts-bot bot commented Dec 29, 2021

Thanks for your contribution!
The community will review it ASAP. In the meanwhile, please checkout the coding standard and Wiki about How to make a pull request.

The pull request is marked to be PR: author is committer because you are a committer of this project.

Document changes are required in this PR. Please also make a PR to apache/echarts-doc for document changes and update the issue id in the PR description. When the doc PR is merged, the maintainers will remove the PR: awaiting doc label.

@echarts-bot echarts-bot bot added PR: author is committer PR: awaiting doc Document changes is required for this PR. PR: awaiting review labels Dec 29, 2021
@pissang pissang requested review from 100pah and Ovilia December 29, 2021 08:22
@pissang pissang added this to the 5.3 milestone Dec 29, 2021
@pissang pissang requested a review from susiwen8 December 29, 2021 08:23
Ovilia
Ovilia approved these changes Dec 29, 2021
View reviewed changes
Copy link
Copy Markdown
Contributor

@Ovilia Ovilia left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@pissang pissang merged commit 951b044 into next Dec 30, 2021
@echarts-bot
Copy link
Copy Markdown

echarts-bot bot commented Dec 30, 2021

Congratulations! Your PR has been merged. Thanks for your contribution! 👍

@pissang pissang deleted the axis-align branch December 30, 2021 14:50
@pissang pissang mentioned this pull request Jan 4, 2022
Merged
3 tasks
pissang added a commit to apache/echarts-doc that referenced this pull request Jan 19, 2022
@pissang
add alignTicks doc apache/echarts#16300
d7f0fce
@maxdor1
Copy link
Copy Markdown

maxdor1 commented Feb 17, 2022 •
edited
Loading

Hi

I can't build an online example because my data is sensitive but here is a screenshot showing that the last right axis min is not calculated correctly:

image

Min value of this dataset is 58.854 but the min axis tick shows as 58.86

@Ovilia Ovilia mentioned this pull request Nov 26, 2022
Open
@agusdutra agusdutra mentioned this pull request Mar 13, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@Ovilia Ovilia Ovilia approved these changes

@100pah 100pah Awaiting requested review from 100pah

@susiwen8 susiwen8 Awaiting requested review from susiwen8

Assignees

No one assigned

Labels

PR: author is committer PR: awaiting doc Document changes is required for this PR. size/L

Projects

None yet

Milestone

5.3

Development

Successfully merging this pull request may close these issues.

3 participants

@pissang @maxdor1 @Ovilia