Highcharts Demo

Jimmy

by 9100bo

HTML

<script src="https://code.highcharts.com/4.2.7/highcharts.js"></script>
<script src="https://code.highcharts.com/4.2.7/modules/boost.js"></script>

<div id="container" style="height: 400px"></div>
<button id="btn">Click to hide all series</button>

JavaScript

var series = [];
const seriesAmount = 90;

for (var i = 0; i < seriesAmount; i++) {
  series.push({});
  series[i].data = [];
  for (var j = 0; j < 50; j++) {
    series[i].data.push(Math.random());
  }
}

let chart = Highcharts.chart('container', {
  plotOptions: {
    series: {
      boostThreshold: 1
    }
  },
  chart: {
    type: 'line',
    zoomType: 'x',
    panning: true,
    panKey: 'shift'
  },

  series: series
});

let visible = true;

btn.addEventListener('click', () => {
  if (visible) {
    for (let i = 0; i < seriesAmount; i++) {
      chart.series[i].hide()
    }
  } else {
    for (let i = 0; i < seriesAmount; i++) {
      chart.series[i].show()
    }
  }
  visible = !visible;
})