在highcharts中正好在x轴类别上方添加标签

时间:2014-12-11 09:57:11

标签: highcharts renderer

我试图放置标签,但我无法找到xAxis_categories的确切位置图。 因此,如果宽度变化,则文本会受到干扰,并且不会与类别保持对齐 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();

1 个答案:

答案 0 :(得分:2)

您可以渲染文本一次,然后查看元素的边界框以确定文本的宽度,然后使用此信息通过再次渲染来创建正确定位的文本。

例如:

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进行演示。