[Bug] ECharts radar.axisName.rotate and radar.axisName.nameRotate Does Not Rotate the Axis Names
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 15h 17m
- Merged PRs (30d)
- 5
Description
### Version
5.6.0
### Link to Minimal Reproduction
https://echarts.apache.org/examples/en/editor.html?code=PYBwLglsB2AEC8sDeAoWsDGwA2wBOAXLANoBEAxAMyUCcAHACIBCpAugDRqxjA6QhFU6dGDwQA5uICmhWKQCGADwgBnUp2GwlqgArAI0MDMFdNYAJ4gpRUioAW8gCbAA7qVOwAvl08bY4sUdBXy5FAEFlFSJiIWELKxsMeSNxfHN1D0dk-WjSAFkYdTkAFQBXKSLSAHUpR0riu1LKgDExSoBlZI7S6DY_dGh5AFspACVgMGTrWABGOh8OLnMI1WjYkUtp0gA3eWxy93RPRfQVGQgpKJJ12EGRm0AXt0BS40B-6MA71IyzTZsAI3k8T7CP54KoQRxgOw2ABsAAYAKSA9BZSbRGYw9iwACsACYMdiYejYNQACwY2iE6iE7H41gLFCeIA&_source=echarts-doc-preview
### Steps to Reproduce
1. Go to this link: https://echarts.apache.org/examples/en/editor.html?c=radar-custom
2. Under the second radar.axisName enter the option nameRotate: 30
```javascript
{
indicator: [
{ text: 'Indicator1', max: 150 },
{ text: 'Indicator2', max: 150 },
{ text: 'Indicator3', max: 150 },
{ text: 'Indicator4', max: 120 },
{ text: 'Indicator5', max: 108 },
{ text: 'Indicator6', max: 72 }
],
center: ['75%', '50%'],
radius: 120,
axisName: {
color: '#fff',
backgroundColor: '#666',
borderRadius: 3,
padding: [3, 5],
nameRotate: 30 // need to rotate the values
}
}
```
### Current Behavior
I am using react-echarts v3.0.2. I am trying to build radars and am trying to rotate the axisNames i.e. the indicators, by an angle. According to the documentation the radar.axisName.rotate and radar.axisName.nameRotate should work.
When I try this on just a bar chart for example (linked above) this doesn't seem to work either. Any help here would be greatly appreciated! I need to deliver these visualisations over the next week!
Ideally I would like to rotate each of the axis names by the angle at which the axes is on. That is the ideal situation.
### Expected Behavior
The expected behaviour is that there is a formatter that I can leverage to set the rotation of the axisName by the axes angle via a method under nameRotate for the axisName under the radar.
### Environment
```markdown
- OS:
- Browser:
- Framework:
```
### Any additional comments?
_No response_
Contributor guide
Research direction
Start with the linked radar-custom reproduction and trace how radar.axisName.rotate and nameRotate are handled in ECharts. Compare the documented behavior with the rendered axis labels, including the requested per-axis-angle behavior. Done means the documented rotation options produce the expected label orientation in the reproduction and the behavior is covered by a regression check.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- data-visualization
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100