javascript - Highcharts 极坐标图定制

Question

我在极坐标图自定义方面遇到问题。我想将数据标签向右移动 45°。

这是小提琴，这是我想要得到的结果：

1. 是否可以使用 Polar Chart（必须是 Polar Chart）来做到这一点？

2. 这是定义标签文本的正确方法吗？

   var categories = ['These', 'are', 'test', 'data'],
   count = 0;
   /* ... */
       labels: {
           formatter: function () {
               var value = categories[count];
   
               count++;
               if (count == 5) {
                   count = 0;
               }
   
               return value;
           }
       }
   

Answer 1

Getting the behaviour you want is a combination of two things:

• Use xAxis.categories instead of formatter: this is easier than creating a custom formatter. You can omit this step if you like depending on where you want the gridlines to be drawn.
• In your series options, set pointPlacement to between: By default, points will be placed facing 'North' by default, but with this option enabled, they'll be placed inbetween (for a graph with four values, it will put them at 45 degrees).

For example:

var categories = ['These', 'are', 'test', 'data'],
count = 0;

$('#container').highcharts({
    // ...        
    xAxis: {
        // ...
        categories: categories,
        // ...
    },
    // ...
    series: [{
        // ...
        pointPlacement: 'between',
        // ...
    }]
});

Answer 2

据我所知，有一个选项startAngle可以让您控制角度，只需像这样添加这个选项：

 chart: {
            polar: true
        },
        pane: {
            startAngle: 45,
        },

        title: {
            text: 'Highcharts Polar Chart'
        },

小提琴

api