CODEWITHSUNDEEP
angularjschartshighchartsparallel-coordinates
Pratik Rawlekar
Pratik Rawlekar

Reputation: 327

Not able to hover on each line in Highcharts's Parallel Coordinate chart

I have implemented Parallel coordinate chart with Highcharts link but not able to hover on each and every line. Instead, it hover on other point.

Upvotes: 0

Views: 311

Answers (1)

ppotaczek
ppotaczek

Reputation: 39099

This problem is already reported on Highcharts GitHub: https://github.com/highcharts/highcharts/issues/9054

To workaround, you can disable Highcharts tooltip and enableMouseTracking option and add your own event to the lines:

    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);
    });

Live demo: https://jsfiddle.net/BlackLabel/so52apLn/

Upvotes: 1

Related Questions