在Highcharts中，图例可以显示为下拉列表，也可以选择全选的选项取消选择所有图例？

Question

我使用的是Highchart，在少数情况下，大数据会在底部显示约100个图例。我的要求是我应该有一个全选或取消全选的选项。在Highchart可行吗？

Answer 1

1. 您可以使用linkedTo功能并将每个系列锚定到虚拟的系列，该系列将负责在图例中切换可见性。

演示：https://jsfiddle.net/BlackLabel/khce1uwp/

  series: [{
      id: 'main',
      name: "main legend",
      data: []
    },
    {
      name: 'Installation',
      data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175],
      linkedTo: 'main'
    }, ...
  ],

API：https://api.highcharts.com/highcharts/series.line.linkedTo

2. 您可以创建一个自定义按钮，以切换系列的可见性。

演示：https://jsfiddle.net/BlackLabel/4zLequ8v/

let btn = document.getElementById("btn"),
  seriesVisible = true;

btn.addEventListener('click', function() {
  if (seriesVisible) {
    chart.series.forEach(s => s.hide());
    seriesVisible = false
  } else {
    chart.series.forEach(s => s.show());
    seriesVisible = true
  }
})