title: Check if all legend items are selected in highcharts?
body: <p>I have a show/hide button which shows and hides charts based on the button text. If a user clicks the 'Hide' button the chart is hidden.'Show' displays the chart. However if the user clicks 'Hide' and manually clicks on all legend item one by one, the text 'Show' remains same. I need it to change to 'Hide' if all legend is manually selected and also 'show' if a user manually deselects all legend.
  How do i do check for this?
  Here is my link to the jsfiddle: <a href="https://jsfiddle.net/ytykG/12/" rel="nofollow">https://jsfiddle.net/ytykG/12/</a></p>
  
  <pre><code>$(function () {
  var chart;
  $(document).ready(function () {
      chart = new Highcharts.Chart({
          chart: {
              renderTo: 'container',
              type: 'line',
              marginRight: 130,
              marginBottom: 25
          },
          title: {
              text: 'Monthly Average Temperature',
              x: -20 //center
          },
          subtitle: {
              text: 'Source: WorldClimate.com',
              x: -20
          },
          xAxis: {
              categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
          },
          yAxis: {
              title: {
                  text: 'Temperature (°C)'
              },
              plotLines: [{
                  value: 0,
                  width: 1,
                  color: '#808080'
              }]
          },
          tooltip: {
              formatter: function () {
                  return '&lt;b&gt;' + this.series.name + '&lt;/b&gt;&lt;br/&gt;' + this.x + ': ' + this.y + '°C';
              }
          },
          legend: {
              //enabled:false,
              layout: 'vertical',
              align: 'right',
              verticalAlign: 'top',
              x: -10,
              y: 100,
              borderWidth: 0
          },
          series: [{
              name: 'Tokyo',
              data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
          }, {
              name: 'New York',
              data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
          }, {
              name: 'Berlin',
              data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
          }, {
              name: 'London',
              data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
          }]
      }, function (chart) {
  
          $('#btn').click(function () {
              for (i = 0; i &lt; chart.series.length; i++) {
                  if ($(this).text() === 'Hide') {
                      chart.series[i].hide();
                  } else {
                      chart.series[i].show();
                  }
              }
              var changeText = ($(this).text() == 'Hide') ? 'Show' : 'Hide';
              $(this).text(changeText);
  
          });
      });
  });
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;script src="http://code.highcharts.com/highcharts.js"&gt;&lt;/script&gt;
    &lt;div id="container" style="height: 400px"&gt;&lt;/div&gt;
  </code></pre>