javascript - Highcharts 在具有多个系列和共享工具提示的图表之间共享工具提示

标签 javascript highcharts

我正在尝试在图表之间设置共享工具提示。仅当工具提示没有 shared: true 时它才有效,如果我设置 shared: true 我会收到错误消息:

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

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

如果您在第一个图表上移动光标 - 它工作得很好,如果您评论 shared: true 它也可以工作,但如果您在第二个图表上移动光标,您将收到错误消息。

有人遇到过这个错误吗? 请帮我解决一下。

最佳答案

出现此问题是因为您在一张图表上设置了 shared: true,而在另一张图表上设置为 default (false)。这是一个问题,因为 tooltip.refresh 方法将采用不同的路径,并根据将共享设置为 true 或 false 的图表使用不同的输入。

你可以找到这个分支 in the source code在第 8806 行,对于 tooltip.refresh 方法:

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

您可以通过在您的 syncTooltip 方法中执行一个分支来处理这种不同的情况(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]);
            }
        }
    }
}

这样您就可以在两个图表上自由地将 shared 设置为 true 或 false。

不幸的是,您的 plotOptions.series.point.events.mouseOver 事件不会捕获通过 shared: true 功能“选择”的点,因此您将必须找到一个替代事件来正确捕捉这种情况。

关于javascript - Highcharts 在具有多个系列和共享工具提示的图表之间共享工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24635610/

相关文章:

javascript - IE9 上的 Highcharts

javascript - 数据标签对齐在 Highchart 时间线中不起作用

javascript - 如何使用 jQuery 对 DOM 元素执行重复的迭代操作?

JavaScript:检测不可见变量

javascript - Firefox 什么时候改变了它的 Function.prototype.toString() 行为?

javascript - 使用声明文件中的 npm 包捆绑类型

javascript - 为什么我的柱形图在 Highcharts 中被裁剪

javascript - 具有绿色/黄色/红色渐变的 Highcharts solidgauge

highcharts - 使 Highchart 和 Highstock 对于不同的数据点具有统一的时间 X 轴

javascript - 获取应用最终格式的轴刻度列表