Add a Specific Y-Axis Label with Highcharts - highcharts

Question

I have a graph with a labelled Y-Axis with points 1 through 100. In addition to the regularly spaced labels (0, 10, 20, etc), I want to add a label for an arbitrary point, say 47. Is this possible with highcharts?

Answer 1

You can add a specific line to the yAxis with the plotLines option.
yAxis: {
plotLines: [{
value: 47,
color: 'rgb(216, 216, 216)',
width: 1,
}]
},
http://jsfiddle.net/nicholasduffy/wa6ukyyp/1/
EDIT:
This seems a bit of a hack, but you could fake the label.
yAxis: {
plotLines: [{
value: 47,
color: 'rgb(216, 216, 216)',
width: 1,
label : {
text: '47',
x: -30,
y: 2
}
}]
},
http://jsfiddle.net/nicholasduffy/wa6ukyyp/2/

Answer 2

Based on your comment, you can add a custom tick with tickPositioner function, with a code like this
$(function () {
$('#container').highcharts({
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
tickInterval: 20, //sets the interval ticks
tickPositioner: function(){
var ticks = this.tickPositions; // gets the tick positions
ticks.push(47); // adds the custom tick
ticks.sort(function(a, b) {
return a - b; // sorts numerically the ticks
});
return ticks; // returns the new ticks
}
},
series: [{
data: [29.9, 71.5, 86.4, 29.2, 44.0, 76.0, 93.5, 98.5, 16.4, 94.1, 95.6, 54.4]
}]
});
});
JSFiddle demo

Answer 3

I think the solution I found that comes closest is to create a line of zero thickness and label the line:
plotLines: [{
value: cutoff,
color: 'rgb(216, 216, 216)',
width: 0,
label: {
text: 'label_name',
style: {
color: 'grey',
fontweight: 'bold'
}
}
}],
The label_name goes pretty close to the Y-Axis, and it gets the point across without putting a tooltip onto the graph