隐藏除选定数据系列以外的所有数据，HighCharts

Question

我有一些使用Highcharts的线图，我需要隐藏除用户选择的数据系列以外的所有数据。样本页面可在http://opheliadesign.com/weight找到。

例如，在身体构成下，点击脂肪会隐藏骨骼，水和BMI - 因此可以更容易地查看身体脂肪图。

谢谢！

Answer 1

我不相信highcharts有hideAll()或类似的功能，但你可以尝试这样的：

//assuming chart is your chart 
series = chart.series; 
for(var i = 0; i < series.length; i++) { 
    if(!series[i].selected) { 
     series[i].hide(); //Hide the series 
    } 
} 

那么你就只需要当你选择一系列调用该代码。你可以通过执行某种检查来做到这一点chart events

Answer 2

很老的线程，但信息仍然有用。

正如@Alvara指出的，有数百个系列，使用.hide()或.show()是相当慢（浏览器冻结几秒钟）。

使用setVisible(false, false)和setVisible(true, false)的方式更快：

legendItemClick: function (event) { 
    if (!this.visible) return true; 

    const series = this.chart.series; 
    const serieLen = series.length; 

    if (series.filter(s => s.visible).length === 1) { 
    for (let i = 0; i < serieLen; i += 1) { 
     series[i].setVisible(true, false); 
    } 
    } else { 
    for (let i = 0; i < serieLen; i += 1) { 
     series[i].setVisible(false, false); 
    } 
    series[this.index].setVisible(true, false); 
    } 
    return false; 
}; 

即使有大的系列，它的工作瞬间。

使用.show().hide()上+50系列已经超过2秒切换可见系列（https://jsfiddle.net/rockshappy/nL5j2rLa/5/）

这里使用setVisible是瞬间（https://jsfiddle.net/rockshappy/nL5j2rLa/2/）