如何使用 Highcharts 用系列数据标记 xAxis？

Question

我是 highchart 的新手，我有 polar chart using highcharts

的演示

    Highcharts.chart('container', {

    chart: {
        polar: true,
        type: 'area'
    },

    accessibility: {
        description: 'ASDFR'
    },

    title: {
        text: '',
        x: -120
    },

    pane: {
        size: '100%',
        startAngle:-42
    },

    xAxis: {
        categories: ['ATT', 'TEC', 'TAC', 'DEF', 'CRE'],
        tickmarkPlacement: 'on',
        lineWidth: 0,
        labels:{
            formatter: function(){
            return this.value + '???' 
          }
        }
    },

    yAxis: {
        gridLineInterpolation: 'polygon',
        
    },

    tooltip: {
        shared: true,
        pointFormat: '<span style="color:{series.color}">{series.name} <b>{point.y:,.0f}</b></span>'
    },

    legend: {
        align: 'right',
        verticalAlign: 'middle',
        layout: 'vertical'
    },

    series: [{
        name: '',
        data: [73, 80, 80, 54, 92],
        
    }],

    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    align: 'center',
                    verticalAlign: 'bottom',
                    layout: 'horizontal'
                },
                pane: {
                    size: '70%'
                }
            }
        }]
    }

});

如何在 xAxis 标签中正确显示系列的值，例如 ATT 73、TEC 80、TAC 80...

Answer 1

可以通过系列数据获取关联值。示例：

    xAxis: {
        ...,
        labels: {
            formatter: function() {
                return this.value + ' ' + this.chart.series[0].yData[this.pos];
            }
        }
    }

现场演示： https://jsfiddle.net/BlackLabel/pyohzk8c/

API参考：https://api.highcharts.com/highcharts/xAxis.labels.formatter

如何使用 Highcharts 用系列数据标记 xAxis？

How to label xAxis with series data using Highcharts?

highcharts