Highcharts Hide All Legend Item

Add a series item with no data that, turns off all other series items.

by HemalathaThanigaivel

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" data-id="1" style="height: 400px"></div>

CSS

#container[data-id="1"] .highcharts-legend .highcharts-legend-item:first-child text {
    color: black !important;
    fill: black !important;
}
#container[data-id="1"] .highcharts-legend .highcharts-legend-item:first-child rect {
    display:none;
}

JavaScript

$(function () {
    $('#container').highcharts({
      chart: {
        type: 'column'
      },
      title: {
        text: 'Chart Title'
      },
      subtitle: {
        text: 'Chart Sub Title'
      },
      series :[
        {name:"Hide All", visible:false },
        {name:"One",data:[208,195.5,93.2,137.2,62.7,189.3,27.8,204.2,233.2,65.8,215.9,44.5],
        visible: false},
        {name:"Two",data:[192.3,104.2,113.3,45.3,39.5,85.5,160.2,108.6,122.6,19.1,53.4,67.4]},
        {name:"Three",data:[186.8,145.5,44.5,111.3,154.2,131.6,58.5,82.1,37.7,90.2,172.4,95.2]},
        {name:"Four",data:[171.9,115.1,19.7,150.6,224.3,49.4,185,88.1,28.3,162.2,138.2,107.1]},
        {name:"Five",data:[11.8,174,180.8,166.2,127.6,138.5,29,137.1,236.6,147.2,72.4,117.4]},
        {name:"Six",data:[67.1,170.4,159,192.2,24.1,230.4,69.5,12,160.6,65.9,202,235.6]},
        {name:"Seven",data:[163.6,204.6,50.8,83,33.9,143.6,203.1,91.2,108.4,44.1,52.4,42.6]},
        {name:"Eight",data:[66.9,14.6,163.2,163.6,218.1,186.1,131.5,97.6,218.2,192.8,15.5,48.2]},
        {name:"Nine",data:[45.4,188.4,201.9,115.5,29.2,44.6,238.3,131.2,207.1,52.9,201.3,62.7]}
      ],
      plotOptions: {
        column: {
          events: {
            legendItemClick: function (col) {
              if (col.target.index === 0) {
                var chart = $('#container').highcharts()
                $(chart.series).each(function(){
                  if (this.index !== 0) {
                    this.setVisible(false, false);
                  }
                });
                return false; 
              }
					  }
          }
        }
      },
      legend: {
        enabled:true
      }
    });
});