gpt4 book ai didi

javascript - Highcharts 条形图 : possible to combine datapoints inside dataLabels?

转载 作者:行者123 更新时间:2023-11-30 10:27:51 33 4
gpt4 key购买 nike

我有一个包含两个系列的 Highcharts 水平条形图。是否可以将分组的数据点组合到每个数据标签中,以便它们一起出现,例如1.00/2.3?

代码:

var labels = [
'AAA/Aaa',
'AA+/Aa1',
'AA/Aa2',
'AA-/Aa3',
'A+/A1',
'A/A2',
'A-/A3'
];
var theData = [
{
name: 'Company 1',
data: [0.576,7.617,12.101,18.839,18.022,7.644,9.72]
},
{
name: 'Company 2',
data: [4.123,12.862,14.561,13.754,12.226,11.135,7.51]
}
];

HIGHCHARTS 配置:

$(function () {
$('#container').highcharts({
chart: {
type: 'bar'
},
legend: {
align: 'center',
layout: 'horizontal',
verticalAlign: 'bottom'
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
formatter: function() {
var out = '<span class="col-chart-label">';
out += this.y + ' / ' + this.y;
out += '</span>'
return out;
},
useHTML: true
}
}
},
series: theData,
tooltip: {
enabled: false
},
xAxis: {
categories: labels,
labels: {
formatter: false,
overflow: 'justify',
rotation: false
},
reversed: true
}
});
});

演示在这里: http://jsfiddle.net/dylanmac/RungW/2/

重申一下,每对条形应该有一个数据标签,顶部条形为第一个值,底部条形为第二个值,以“/”分隔

非常感谢。

最佳答案

您可以遍历所有系列并对特定类别的值求和,请参阅:http://jsfiddle.net/RungW/3/

                formatter: function() {
var out = '<span class="col-chart-label">',
series = this.point.series.chart.series,
p1 = series[0].yData[this.point.x],
p2 = series[1].yData[this.point.x];
out += this.y + ' / ' + (p1 + p2);
out += '</span>'
return out;
},

关于javascript - Highcharts 条形图 : possible to combine datapoints inside dataLabels?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18750627/

33 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com