无法在高图线图中获取基于X轴值的独特工具提示 [英] Trouble getting unique tooltip based on X axis values in highcharts line graph

问题描述

我试图制作一个图表，其中不同x轴值的点具有不同的工具提示。系列中的前两个点具有相同的工具提示，即使它们的x轴值不同也是如此。应该有第11条评论工具提示，即使它们的X轴值相同，但不是Y轴值，Feb也应该有第22条评论工具提示等等。

当前的计算逻辑是工具提示取决于y轴的值。只要y轴的值正在改变，工具提示会相应地改变。发生这种情况的原因是下面代码中的this.y语句。

这个逻辑的问题是，只要y轴的值不同，工具提示可以正常工作，那么一系列的2个连续点具有相同的y轴值的工具提示当它们的x值不同时不会改变......

为了使工具提示根据x轴值改变，我将this.y替换为this .x，但期望的变化没有发生。可以请你告诉我如何做出改变？

工具提示代码..

 工具提示：{
 formatter：function（）{
 var serieI = this.series.index; 
 var index = dataValues.indexOf（this.y）; 
 var index1 = dataValues2.indexOf（this.y）; 
调试器; 
 var comment =; 
 if（serieI == 0）{
 comment = $（＃ppForm.textarea：eq（+（index）+））。val（）; 
} else {
 // comment =第二个系列匹配！; 
 comment = $（＃ppForm.textarea：eq（+（index1）+））。val（）; 
} 
 / * return''+ this.x + 
'< / b>是< b>'+ this.y +'< / b> - >'+ comment; * / 
 return' - >'+ comment; 
 
 
  

js小提琴是... http://jsfiddle.net/RbenU/25/

解决方案

对于 dataValues 使用索引而不是对类别使用索引，这样： http://jsfiddle.net/RbenU/39/

  tooltip：{
 formatter：function（）{
 var serieI = this.series.index; 
 var index = categories.indexOf（this.x）; 
 var comment = $（input：eq（+（index）+））。val（）; 
 return' - >'+ comment; 
} 
}，
  

I'm trying to make a graph in which points having different x axis values have different tooltip .The 1st two points of a series have the same tooltip even though their x axis values are different.i.e points under the month of jan should have "11st comment" tooltip,points under Feb should have "22nd comment" tooltip so on and so forth even if their x axis values are same but not y axis values..

The current computational logic is that the tooltip depends upon the y axis values.As long as y axis values are changing the tool tip changes accordingly.This happens because of the statement"this.y" in the below code..

The problem with this logic is that as long as y axis values are distinct the tooltip works properly,the moment 2 consecutive points of a series have same y axis values the tooltip does not change when their x values are different...

To make the tooltip change acoording to x axis values I am replacing "this.y" with "this.x" but the desired change is not happening.Can you please tell me how to make that change?

The tool tip code..

       tooltip: {
       formatter: function () {
        var serieI = this.series.index;
      var index = dataValues.indexOf(this.y);
     var index1= dataValues2.indexOf(this.y);
      debugger;
        var comment = "";
        if (serieI == 0) {
            comment = $("#ppForm.textarea:eq(" + (index) + ")").val();
        } else {
           //comment = "second serie matched!";
            comment = $("#ppForm.textarea:eq(" + (index1) + ")").val();
        }
        /*return ''+ this.x +
            '</b> is <b>' + this.y + '</b> -->' + comment;*/
        return '-->'+comment;
    }
}

The js fiddle is... http://jsfiddle.net/RbenU/25/

解决方案

Instead of using index for dataValues use index for categories, this way: http://jsfiddle.net/RbenU/39/

tooltip: {
        formatter: function () {
            var serieI = this.series.index;
            var index = categories.indexOf(this.x);
            var comment = $("input:eq(" + (index) + ")").val();
            return '-->'+comment;
        }
    },

这篇关于无法在高图线图中获取基于X轴值的独特工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！