Highcharts通过多个系列和共享工具提示在图表之间共享工具提示 [英] Highcharts shared tooltip between charts with multiple series and shared tooltip

问题描述

我试图在图表之间设置共享工具提示。只有当tooltip没有 shared：true ，如果我设置了 shared：true ，我得到错误：

  TypeError：'undefined'不是一个对象（评估'a [0] .category'）highcharts.js：3259 
  

我准备的例子： http://jsfiddle.net/CAKQH/24408/

如果将光标移动到第一个图表上，如果你评论 shared：true ，它会起作用，但是如果你将光标移动到第二个图表上，你会得到一个错误。

<有人遇到过这个错误吗？
帮助我解决它。

解决方案

发生此问题是因为您有共享：true 在一个图表上，而另一个图表上有默认值（false）。这是一个问题，因为 tooltip.refresh 方法将采用不同的路径，并根据共享设置为true或false的图表使用不同的输入。

您可以在8806行中找到此分支的源代码中的 tooltip.refresh 方法：

  //共享工具提示， 
 if（shared&&！（point.series&&& point.series.noSharedTooltip））{
 .... 
} 
 //单点工具提示
 else {
 .... 
} 
  

您可以通过在 syncTooltip 方法中执行分支来处理这种情况，以处理像这样的不同情况（例如JFiddle ）：

 函数syncTooltip（container，p）{
 var i = 0; （$; 
 for（; i< charts.length; i ++）{
 if（container.id！= charts [i] .container.id）{
 if（charts [i] .tooltip .shared）{
 charts [i] .tooltip.refresh（[charts [i] .series [0] .data [p]]）; 
} 
 else {
 charts [i] .tooltip.refresh（charts [i] .series [0] .data [p]）; 
} 
} 
} 
} 
  

您可以在两个图表上自由设置共享为true或false。

不幸的是，您的 plotOptions.series.point.events.mouseOver -event不会捕获已选中的点通过共享：true 功能，所以你必须找到一个备用事件来正确捕捉这种情况。

I'm trying to set shared tooltip between charts. It works nice only if tooltip doesn't have shared: true, if I set shared: true I get error:

TypeError: 'undefined' is not an object (evaluating 'a[0].category') highcharts.js:3259

I prepared example: http://jsfiddle.net/CAKQH/24408/

If you move cursor on first chart - it works nice, also if you comment shared: true it works, but if you move cursor on second chart you'll get an error.

Did someone faced this error? Help me to solve it, please.

解决方案

The problem occurs because you have shared: true on one chart, while having it default (false) on the other. This is a problem because the tooltip.refresh method will take different paths and use the input differently based the chart having shared set to true or false.

You can find this branching in the source code on line 8806, for the tooltip.refresh method:

// shared tooltip, array is sent over
if (shared && !(point.series && point.series.noSharedTooltip)) {
    ....
}
// single point tooltip
else {
    ....
}

You can handle this by doing a branching inside your syncTooltip method to handle the different cases like this (example JFiddle):

function syncTooltip(container, p) {
    var i = 0;
    for (; i < charts.length; i++) {
        if (container.id != charts[i].container.id) {
            if(charts[i].tooltip.shared) {
                charts[i].tooltip.refresh([charts[i].series[0].data[p]]);
            }
            else {
                charts[i].tooltip.refresh(charts[i].series[0].data[p]);
            }
        }
    }
}

This way you can freely set shared to true or false on both charts.

Unfortunately your plotOptions.series.point.events.mouseOver-event doesn't capture points that are "selected" through the shared: true functionality, so you will have to find an alternate event to properly capture this situation.

这篇关于Highcharts通过多个系列和共享工具提示在图表之间共享工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！