-
Notifications
You must be signed in to change notification settings - Fork 19.7k
feat(gauge): axisLabel support angle rotating. close 15944 #16985
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
Thanks for your contribution! |
Wow looks great! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the contribution!
Please also fix the lint problems found in the GitHub Actions.
src/chart/gauge/GaugeSeries.ts
Outdated
@@ -172,6 +172,7 @@ export interface GaugeSeriesOption extends SeriesOption<GaugeStateOption, GaugeS | |||
|
|||
axisLabel?: LabelOption & { | |||
formatter?: LabelFormatter | string | |||
rotating?: boolean |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would suggest using rotate
as the of series[sunburst].label.rotate
and instead of using a boolean
type, I think it would be more useful to provide the type 'tangential' | 'radial' | number
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done. @Ovilia |
@Ovilia |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I have run visual tests for gauge related cases and all are as expected.
verticalAlign: 'middle', | ||
align: 'center' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think you did an excellent job! This feature is really helpful!
Current implementation looks great. I only have a little doubt about text alignment. It doesn't look very obvious but if you look carefully, you should find that it may not be sufficient to use verticalAlign: 'middle', align: 'center'
.
As you can see from this example, the text is aligned to center but in most situations, we may wish to align them to the inner side (which means align to right for text on the left side, and left on the right) or to the outter side vice versa.
But I think we can make this a new feature in another PR by providing new options as align
and verticalAlign
if you are interested or when some developers ask for such a feature. So I will approve this PR for now.
To reviewers: If this PR is going to be described in the changelog in the future release, please make sure this PR has one of the following labels: This message is shown because the PR description doesn't contain the document related template. |
Congratulations! Your PR has been merged. Thanks for your contribution! 👍 |
@MeetzhDing Please also help make a document PR to echarts-doc at the |
doc(gauge): axisLabel support rotate apache/echarts#16985
Brief Information
This pull request is in the type of:
What does this PR do?
gauge text label rotate. #15944
Details
Before: What was the problem?
gauge text label can`t rotating by angle.
After: How is it fixed in this PR?
add new option:


gauge-series.axisLabel.rotating
if true, rotating label by angle.
Misc
Related test cases or examples to use the new APIs
gauge-case.html
gauge-simple.html