我有以下高位图表:
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
defaultSeriesType: 'scatter',
zoomType: 'xy'
},
title: { text: 'Report' },
xAxis: { title: { enabled: true, text: 'Score' },
startOnTick: true, endOnTick: true, showLastLabel: true, min: -10, max: 11 },
yAxis: { title: { text: 'Question', align: 'left' }, min: 0, max: 27, reversed: true, categories: categories, labels: {enabled: true}},
tooltip: { formatter: function() { return '' + this.x +' score'; } },
legend: {
layout: 'vertical',
align: 'left',
verticalAlign: 'top',
x: 320,
y: 35,
floating: true,
backgroundColor: Highcharts.theme.legendBackgroundColor || '#FFFFFF',
borderWidth: 1,
width: 200,
height: 200
},
plotOptions: {
linewidth: 10,
series: {
shadow: true,
dataLabels: {
enabled: true,
align: 'center',
verticalAlign: 'bottom',
rotate: 0,
formatter: function() {
return '<b style="color:gray">' + this.point.x + '</b>';
},
style: {
color: '#000',
font: 'bold 18px "Trebuchet MS", Verdana, sans-serif;'
},
x:-25,
y:7
}
},
scatter: {
marker: {
enable: false,
radius: 15,
states: {
hover: {
enabled: true,
lineColor: 'rgb(100,100,100)'
}
}
},
states: {
hover: {
marker: {
enabled: false
}
}
}
}
},
series: [{
id:'def',
name: 'def',
color: 'rgba(223, 83, 83, .5)',
data: [[10,2],[9,3],[9,4],[5,5],[6,6],[7,7],[9,8],[8,9],[9,11],[7,12],[6,13],[8,14],[7,15],[8,16],[6,18],[8,19],[9,20],[7,22],[6,23],[9,25],[9,26]]
}, {
id:'abc',
name: 'abc',
color: 'rgba(119, 152, 191, .5)',
data: [[6,2],[3.5,3],[7.5,4],[9,5],[3.5,6],[5,7],[9,8],[5,9],[8.5,11],[8.5,12],[8.5,13],[-1,14],[10,15],[8,16],[7.5,18],[7,19],[7,20],[5,22],[8,23],[7,25],[6.5,26]]
}]
});
我想为数据标签设置不同的样式，所以 abc 向左拉(使用 x 参数)，def 向右拉。
目前两者都是全局设置的。
如果我尝试:
chart.series[1].options.dataLabels.x=25;
chart.redraw()
什么都没发生，数据标签是一样的。
关于如何做到这一点有什么想法吗？
最佳答案
您可以像本例一样为每个系列设置数据标签的格式:
<罢工> Setting series-level data label options
$(function () {
$('#container').highcharts({
chart: {
marginRight: 50
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, {
dataLabels: {
enabled: true,
align: 'left',
crop: false,
style: {
fontWeight: 'bold'
},
x: 3,
verticalAlign: 'middle'
},
y: 54.4
}]
}]
});
});
关于javascript - Highcharts 将每个系列的数据标签分开，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9525023/