鉴于下图 - 我想从每个列的图例中取出标签并将其打印在列本身上。我无法在HighCharts API中找到允许我这样做的任何内容。有没有人有任何关于我能看到的这样的想法或例子?
谢谢!
修改
我想要完成的事情有一个更好的例子
我认为这很容易辨别。用例是这些统计数据显示在呼叫中心周围的大型监视器上。图例通常太小,无法从任何给定距离读取。
答案 0 :(得分:19)
只需尝试格式化柱形图上的数据标签,这是一个让您入门的示例。
$(function () {
$('#container').highcharts({
chart: {
type: 'column'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
color: '#000',
style: {fontWeight: 'bolder'},
formatter: function() {return this.x + ': ' + this.y},
inside: true,
rotation: 270
},
pointPadding: 0.1,
groupPadding: 0
}
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]
});
});
答案 1 :(得分:5)
实际上,这种情况需要的是,这是一个条形而不是一个列,以及没有旋转的类别标签,并且清晰可读。
Example:
http://jsfiddle.net/jlbriggs/yPLVP/23/
您也可以偏移轴标签,将类别名称放在栏上,但实际上 - 它不像上面的示例那样显示:
http://jsfiddle.net/jlbriggs/yPLVP/24/
当然,这些都可以是列而不是栏,但如果可以避免,旋转标签总是一个坏主意。
这些方法还允许数据标签在需要时仍然用作数据标签。