Highcharts text labels for y-axis

后端 未结 2 1450
梦毁少年i
梦毁少年i 2020-12-05 17:57

I\'m using Highcharts and would like to display a simple column graph, but instead of using numeric values for the y-axis, I would like to use text values.
For example,

相关标签:
2条回答
  • 2020-12-05 18:20

    You can change the labels by using a label formatter. Assuming your data is formed appropriately, you can do something like the following:

    var yourLabels = ["Very Low", "Low", "Medium", "High", "Very High"];
    var yourChart = new Highcharts.Chart({
        //...
        yAxis: {        
            labels: {
                formatter: function() {
                    return yourLabels[this.value];
                }
            }
        }
        //...
    });
    
    0 讨论(0)
  • 2020-12-05 18:24

    Declare an object which will be used to switch the values you want to change, like the following.

    var change = {
        0: 'Very Low',
        5: 'Low',
        10: 'Medium',
        15: 'High',
        20: 'Very High'
    };
    

    Then on your chart options use labels formatter to switch it.

    yAxis: {
        labels: {
            formatter: function() {
                var value = change[this.value];
                return value !== 'undefined' ? value : this.value;
            }
        }
    }
    
    0 讨论(0)
提交回复
热议问题