[Bug] ECharts radar.axisName.rotate and radar.axisName.nameRotate Does Not Rotate the Axis Names

[yribeiro-sent]

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

    {
      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

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[helgasoft]

According to the documentation the radar.axisName.rotate and radar.axisName.nameRotate should work.

I cannot find such parameters in the axisName API. Can you provide links?

[yribeiro-sent]

According to the documentation the radar.axisName.rotate and radar.axisName.nameRotate should work.

I cannot find such parameters in the axisName API. Can you provide links?

Ah yes! You are correct - the radar.axisName does not have a rotate property. I was looking at the xAxis.nameRotate instead!

However, even when I try this value it doesn't seem to work. Maybe I should change the title of the issue?

Alternatively, is there a way we can extend the radar plot to have this capability?

[helgasoft]

There is no xAxis.name in your barchart code, only axisLabels.

[yribeiro-sent]

Ah sorry, I'm referring to the xAxis.nameRotate property. I may not have used this correctly.

[helgasoft]

when you add a name, then nameRotate will work

[yribeiro-sent]

Yes! You are right. This works.

So I guess there is no equivalent for radar axes then? I was trying to create something like this:

[helgasoft]

So I guess there is no equivalent for radar axes then? I was trying to create something like this:

correct, no equivalent. The closest analog in ECharts is sunburst.label.rotate 'tangential' official example, and pie.label.rotate.
You could change your title from [Bug] to [Feature] and rephrase it.
This would be also a good feature for the proposed new radar chart.

BTW, there is a crazy 🤪 workaround with a superimposed pie just for the rotated labels - Demo.