highcharts - add label for missing column - highcharts

Question

In my chart, I have a column with a value of -1. This is to indicate that the value for this series is not available.
In the chart, I would like to add a label rotated 90 degrees that says "No data" where the bar should be. Can someone provide me with an example for how to accomplish this?

Answer 1

If you have a column with -1 it will still be rendered. You need to map -1 values to null. After that you can use renderer.text function and render a rotated text for the null columns.
Function for rendering/redrawing labels:
function renderLabels() {
this.series[0].points.forEach((point, i) => {
if (point.isNull) {
point.noDataLabel = this.renderer.text('No data', 0, -9e9).attr({
rotation: 90,
zIndex: 99
}).add()
}
})
redrawLabels.call(this)
}
function redrawLabels() {
this.series[0].points.forEach(point => {
if (point.noDataLabel) {
point.noDataLabel.attr({
x: point.series.group.translateX + point.plotX,
y: this.plotTop + this.plotHeight - 80
})
}
})
}
Attach functions on load and redraw events, and map data:
Highcharts.chart('container', {
chart: {
type: 'column',
events: {
load: renderLabels,
redraw: redrawLabels
}
},
series: [{
data: data.map(v => v === -1 ? null : v)
}]
});
Example and output
http://jsfiddle.net/n3nuhvL7/