Highcharts:是否可以在工具提示格式化程序中将序列与外部变量进行比较?

Highcharts:是否可以在工具提示格式化程序中将序列与外部变量进行比较?,highcharts,tooltip,Highcharts,Tooltip,我想比较一个具有相同x轴但不同y值的外部变量的序列。为了更容易解释这个问题,提供了一个示例代码 数据系列如下: series: [{data: [5, 4, 5, 7, 8, 6, 3, 6, 7, 4, 8, 9]}, {data: [4, 6, 7, 9, 5, 9, 12, 11, 9, 7, 6, 5]}] 外部变量是 var extdata = [2,2,2,1,0,0,0,1,1,2,2,2]; 它们共享相同的x轴(本例中为一月、二月、十二月)。假设我想显示一个工具提示“m

我想比较一个具有相同x轴但不同y值的外部变量的序列。为了更容易解释这个问题,提供了一个示例代码

数据系列如下:

series: [{data: [5, 4, 5, 7, 8, 6, 3, 6, 7, 4, 8, 9]},
   {data: [4, 6, 7, 9, 5, 9, 12, 11, 9, 7, 6, 5]}]
外部变量是

var extdata = [2,2,2,1,0,0,0,1,1,2,2,2];
它们共享相同的x轴(本例中为一月、二月、十二月)。假设我想显示一个工具提示“max”,当该月序列中的数据点加上外部变量中的相应条目至少为10时,但保留总和的数值,否则,3月份的工具提示为

March:
Series 1: 7
Series 2: 9
在四月的时候

April:
Series 1: 8
Series 2: Max

是否可以仅使用工具提示格式化程序执行此操作?如果不这样做,如何实现这一目标?谢谢

有几种方法可以做到这一点,但我能想到的最简单的方法是将extdata格式化如下:

var extdata = {'Jan':2,
           'Feb':2,
           'Mar':2,
           'Apr':1,
           'May':0,
           'Jun':0,
           'July':0,
           'Aug':1,
           'Sep':1,
           'Oct':2,
           'Nov':2,
           'Dec':2};
formatter: function () {
        var s = '<b>' + this.x + '</b>';
        var month = this.x;
            $.each(this.points, function (i, point) {
                var total = point.y + extdata[month];
                s += '<br/>' + point.series.name + ': ' + (total>=10?'max':point.y);
            });
        return s;
    },
s+= '<br/>Ext data: ' + extdata[this.points[0].point.x]; 
然后,在工具提示功能中,可以如下方式引用它:

var extdata = {'Jan':2,
           'Feb':2,
           'Mar':2,
           'Apr':1,
           'May':0,
           'Jun':0,
           'July':0,
           'Aug':1,
           'Sep':1,
           'Oct':2,
           'Nov':2,
           'Dec':2};
formatter: function () {
        var s = '<b>' + this.x + '</b>';
        var month = this.x;
            $.each(this.points, function (i, point) {
                var total = point.y + extdata[month];
                s += '<br/>' + point.series.name + ': ' + (total>=10?'max':point.y);
            });
        return s;
    },
s+= '<br/>Ext data: ' + extdata[this.points[0].point.x]; 
格式化程序:函数(){
var s=''+此.x+'';
var月=此.x;
$.each(this.points,function(i,point){
var总计=点y+外部数据[月];
s+=“
”+point.series.name+”:“+(总计>=10?”:最大值:point.y); }); 返回s; },


通过索引当月的extdata,您可以避免计算出悬停在哪个点上。如果您愿意,您可以通过在类别上迭代查找月份名称来解决此问题。

对于分类,SteveP的答案非常好。但如果您不想格式化数据,请使用以下方法:

var extdata = {'Jan':2,
           'Feb':2,
           'Mar':2,
           'Apr':1,
           'May':0,
           'Jun':0,
           'July':0,
           'Aug':1,
           'Sep':1,
           'Oct':2,
           'Nov':2,
           'Dec':2};
formatter: function () {
        var s = '<b>' + this.x + '</b>';
        var month = this.x;
            $.each(this.points, function (i, point) {
                var total = point.y + extdata[month];
                s += '<br/>' + point.series.name + ': ' + (total>=10?'max':point.y);
            });
        return s;
    },
s+= '<br/>Ext data: ' + extdata[this.points[0].point.x]; 
s+='
外部数据:'+extdata[this.points[0].point.x];
其中
this.points[0]。point.x
等于外部数据索引的索引



但是,如果您的xAxis没有分类,您只需像前面的回答一样通过
this.x
获取索引即可

谢谢。我最终寻找索引,因为我的实际数据有很多点,这比改变外部变量的结构容易。是否可以在不使用x轴变量查找匹配项的情况下检索索引?如果这是可能的,我可以进一步简化我的代码,节省一点计算能力。谢谢-这也很有效。但是我的实际数据实际上是一个二维数组,第一个维度是x轴值,因此
这个.points[0]。point.x
将返回x值,而不是整数索引。我想知道是否有办法找到索引。不幸的是,没有像“index”这样的属性。您可以使用
inArray()
JS内置函数,其中的x值列表可以在以下位置找到:
this.points[0].series.xData