我正在尝试使用与其系列相同的颜色设置数据标签的backgroundColor(UI原因)。
我尝试使用formatter选项并返回带有所需样式的“div”,但只有字体颜色适用于dataLabel。
我该如何解决这个问题?按照我正在尝试的代码。
$(function () {
$('#container').highcharts({
chart: {
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
plotOptions : {
series : {
dataLabels : {
enabled : true,
formatter : function() {
return $('<div/>').css({
'color' : this.series.color, // works
'border' : '1px solid black', // don't work
'backgroundColor' : this.series.color // don't work
}).text(this.y)[0].outerHTML;
}
}
}
},
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]},
{
data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5]}]
});
});
链接到实例:http://jsfiddle.net/eVfZD/
更新:
解决方案很简单。只需将选项“useHTML”设置为true,并将样式设置为在formatter函数内创建的“div”。