добавление меток точно выше категорий оси x в highcharts

Question

Я попытался поместить метки, но я не могу найти точное местоположение xAxis_categories realtive для построения графика. Итак, если ширина изменяется текст становится нарушается и не оставался в соответствии с категориями http://jsfiddle.net/akataria/qx4snpvb/8/

startX = chart.xAxis[0].minPixelPadding + chart.xAxis[0].left , 
startY = chart.plotTop, 
debugger; 
r.text('19% yoy increase ', startX , startY) 
.css({ 
color: '#4572A7', 
fontSize: '11px', 
}).add(); 

Answer 1

Вы можете вынести текст один раз, а затем посмотреть на ограничительной рамке элемента, чтобы определить ширину текста, а затем используйте эту информацию, чтобы создать правильно позиционированный текст, сделав его снова.

Например:

var element = r.text('19% yoy increase ', 0 , 0) 
.css({ 
    fontSize: '11px' 
}).add(); 

var width = element.getBBox().width; 
element.destroy(); 

r.text('19% yoy increase ', data[0].plotX + chart.plotLeft - (width/2) , startY) 
.css({ 
    color: '#4572A7', 
    fontSize: '11px'   
}).add(); 

См this JSFiddle для демонстрации.