I am generating 10 multiple series in one chart, by-default two series are kept visible others are hidden, others are displayed when clicked on buttons respectively. But the problem is "On hover data is being fetched only from last rendered series", I want to fetch data from series on which i hover.
Code to fetch data is this:
var $reporting = $('#hist_riskvalue'); /*HTML Div where data will be displayed*/
var $reporting2 = $('#hist_gindex'); /*HTML Div where data will be displayed*/
plotOptions: {
series: {
compare: 'percent',
point: {
events: {
mouseOver: function () {
var series = this.series.chart.series,
x = this.x,
y = this.y,
output = Highcharts.numberFormat(Math.abs(y));
//loop each series
$.each(series, function (i, e) {
if(i>0) {
$.each(series[i].data,function(j,point){
if(point.x === x) {
output += Highcharts.numberFormat(Math.abs(y));
}
});
}
});
var points = $('#histper-chart').highcharts().series[0].points;
for (var i = 0; i < points.length; i++) {
if (points[i].y === y){
yy = points[i].y;
output2 = Highcharts.numberFormat(Math.abs(yy));
break;
}
}
$reporting.html(output);
$reporting2.html(output2);
}
}
}
}
},
