无法悬停在 Highcharts 平行坐标图中的每条线上答案

【问题标题】：Not able to hover on each line in Highcharts's Parallel Coordinate chart无法悬停在 Highcharts 平行坐标图中的每条线上
【发布时间】：2018-10-22 07:25:17
【问题描述】：

我已经使用 Highcharts link 实现了平行坐标图，但无法在每条线上悬停。相反，它会悬停在其他点上。

【问题讨论】：

标签： angularjs charts highcharts parallel-coordinates

【解决方案1】：

Highcharts GitHub 上已经报告了这个问题：https://github.com/highcharts/highcharts/issues/9054

要解决此问题，您可以禁用 Highcharts tooltip 和 enableMouseTracking 选项并将您自己的事件添加到行中：

    var lines = $('.highcharts-series path');

    lines.on('mouseover', function(e) {
        var series,
            result = '',
            i;

        for (i = 0; i < chart.series.length; i++) {
            if (chart.series[i].graph.d === this.getAttribute("d")) {
                series = chart.series[i];
                i = chart.series.length;
            }
        }

        Highcharts.each(series.points, function(p) {
            result += p.category + ' ' + p.y + '<br>'
        });

        $("#tooltip").html(result);
    });

现场演示：https://jsfiddle.net/BlackLabel/so52apLn/

【讨论】：

@ppotaczed 我尝试了这个解决方案，但没有奏效。系列从未被填充，因为 (chart.series[i].graph.d === this.getAttribute("d")) 条件不满足。因此，我收到“未捕获的类型错误：无法读取未定义的属性‘点’”错误。也必须禁用工具提示。？
对不起。现在我禁用了 enableMouseTracking，所以 (chart.series[i].graph.d === this.getAttribute("d")) 条件给了我一个点，但悬停线没有突出显示。
嗨 Pratik Rawlekar，要突出显示悬停线，您必须向 .highcharts-series path:hover 添加适当的样式，就像在我的示例中一样。
是的，添加此样式后，它起作用了。但我认为，现在有一个 zIndex 问题。因为悬停的线在某些点不可见。
要解决这个问题，可以在series.graph.parentGroup元素上使用toFront方法：jsfiddle.net/BlackLabel/zh2tnwd4