CODEWITHSUNDEEP
highcharts
user2677672
user2677672

Reputation: 45

Rotating xAxis categories in Polar Chart using Highcharts?

Currently, the categories are displaying as rotation is set '0'.

Default

Where as I have to display text around the circle. something similar to this Text around the circle

Please help me to find the right setting for this?

Upvotes: 0

Views: 451

Answers (1)

ppotaczek
ppotaczek

Reputation: 39139

There is no default option in Highcharts for this, but you can calculate the rotation for each label. Additionally, you will need to set align for axis labels to center:

    events: {
        render: function() {
            var ticks = this.xAxis[0].ticks,
                length = this.xAxis[0].categories.length,
                rotation = 360 / length / 2;

            Highcharts.objectEach(ticks, function(tick) {
                tick.label.attr({
                    rotation: rotation
                });

                rotation += 360 / length;
            });
        }
    }

Live demo: http://jsfiddle.net/BlackLabel/shgj8o9t/

API: https://api.highcharts.com/highcharts/xAxis.labels.align

Upvotes: 1

Related Questions