Javascript Highcharts分组列标签

Javascript Highcharts分组列标签,javascript,highcharts,Javascript,Highcharts,我有一个highcharts分组柱形图,x轴上每个值有两列。我想能够添加一个标签以上的每一组与百分之二之间的差异。我似乎找不到任何方法来引用格式化程序选项中的两列 这是我遇到问题的部分: column: { dataLabels: { formatter: function() { return this.y; } } } 这里,y应该是区别

我有一个highcharts分组柱形图,x轴上每个值有两列。我想能够添加一个标签以上的每一组与百分之二之间的差异。我似乎找不到任何方法来引用格式化程序选项中的两列

这是我遇到问题的部分:

column: {
    dataLabels: {
        formatter: function()
        {                                
            return this.y;
        }
    }
}
这里,y应该是区别

现在就是这样


我只想在这两列上各添加一个标签,标签上有一个百分比差异。

一种可能是预先计算所有差异,然后在
格式化程序中引用它们。例如,在变量中定义
系列
,并在其上循环以创建一个单独的差异数组,如下所示:

var series = [{
    name: 'Omsetning',
    data: [
        // ...
    ]
    }
    // ...
];

var diffs = [];

for(i = 0; i < series[0].data.length; i++) {
    var v1 = series[0].data[i].y;
    var v2 = series[1].data[i].y;
    diffs.push( (Math.abs(v1-v2) / ((v1+v2) / 2)) * 100 );
}

$('#container').highcharts({
    plotOptions: {
        column: {
            dataLabels: {
                formatter: function()
                {                                
                    return Highcharts.numberFormat(diffs[this.x])+"%";
                }
            }
        }
    }
    series: series
    // ...
});
var系列=[{
名称:“Omsetning”,
数据:[
// ...
]
}
// ...
];
var-diff=[];
对于(i=0;i<系列[0]。data.length;i++){
var v1=系列[0]。数据[i]。y;
var v2=系列[1]。数据[i]。y;
压差((数学abs(v1-v2)/(v1+v2)/2))*100;
}
$(“#容器”)。高图({
打印选项:{
专栏:{
数据标签:{
格式化程序:函数()
{                                
返回Highcharts.numberFormat(diff[this.x])+“%”;
}
}
}
}
系列:系列
// ...
});

查看它的外观。

格式化程序中
回调中,您可以使用
series.chart.series[1].yData
属性获取第二列/系列的
y
yData
是所有
y
值的数组。然后,您可以使用
point.index
属性获取第二列/系列的对应点

column: {
    dataLabels: {
        formatter: function()
        {   
            var firstColumnValue = this.y;
            var secondColumnValue = this.series.chart.series[1].yData[this.point.index];
            var yourCalculation = (firstColumnValue - secondColumnValue) / firstColumnValue * 100;
            return yourCalculation.toFixed(2) + '%';
        }
    }
}

更新了

这是一个非常优雅的解决方案。它就像一个符咒。我刚刚将计算更改为var yourculation=secondColumnValue/firstColumnValue*100;
yData
是否在
data
之前(以及在调用
formatter
之前)以某种方式定义?
yData
data
都是在创建(或设置)时填充的,但不同
yData
包含干净的值和转换为点的
数据。由于
yData
是在创建时填充的,因此可以假定它将在调用
formatter
之前定义。