Search code examples
javascripthighchartsaxis-labelsyaxis

Highcharts y-axis units on top

I would like to add y-axis units on top of the y-axis.

For now I could use labels formatter and make the last label to be the unit. It works fine until I have just one label on y-axis. Then I get this:

enter image description here

And I would like to get this:

enter image description here

Do you have an idea of how to get it?

Jsfiddle here: http://jsfiddle.net/ptbtvozb/2/

Code here:

Highcharts.chart('container', {
    yAxis: {
        labels: {
            formatter: function() {
                var unit = 'pop';
                if(this.isLast) {
                    return unit;
                } else {
                    return this.value;
                }
            }
        },
        tickInterval: 1,
        title: { text: "RQ-online" }
    },
    series: [{
        data: [[0, 1],[1, 1],[2, 1]]
    }]
});
Solution

  • Use yAxis.title:

    yAxis: {
  title: {
    text: 'pop',
    align: 'high',
    offset: 0,
    rotation: 0,
    y: -10
  },

    live example: http://jsfiddle.net/akLc93mh/