javascripthighchartslegendseriesng-hide

HighCharts Disable some Series Name from the Legend

I am using HighChart,i want to disable legend as the given example there are 3 legend (Test1,Test2,Test3), I only want that there will be only one (Test2) to show and others are disabled,

this.options1 =
{
    chart:
    {
        type: 'area' // area areaspline bar column line spline
    },
    title:
    {
        text: 'Fruit Consumption'
    },
    xAxis:
    {
        categories: ['01-01-2019', '02-01-2019', '03-01-2019','04-01-2019', '05-01-2019', '06-01-2019','07-01-2019', '08-01-2019', '09-01-2019','10-01-2019', '11-01-2019', '12-01-2019','13-01-2019', '14-01-2019', '15-01-2019','16-01-2019', '17-01-2019', '18-01-2019','19-01-2019', '20-01-2019', '21-01-2019','22-01-2019', '23-01-2019', '24-01-2019']
    },
    yAxis:
    {
        title: false
    },
    series:
    [{
        name: 'Test1',
        data: [1000, 5000, 10000,5500, 7500, 3940,5500, 7500, 3940,1000, 5000, 10000,5500, 7500, 3940,1000, 5000, 10000,1000, 5000, 10000,5500, 7500, 3940]
    },
    {
        name: 'Test2',
        data: [5500, 7500, 3940,1000, 5000, 10000,1000, 5000, 10000,5500, 7500, 3940,1000, 5000, 10000,5500, 7500, 3940,5500, 7500, 3940,1000, 5000, 10000]
    },
    {
        name: 'Test3',
        data: [2200, 3500, 1940,9000, 1000, 5000,7000, 3000, 2000,10500, 1500, 2940,5000, 1000, 1000,2500, 4500, 5940,6500, 9500, 8940,7000, 6000, 5000]
    }
  ]
}
var myChart1 = HighCharts.chart('container1',this.options1);

the output of this code is

enter image description here

and i want my expected output like this

enter image description here

what I tried

series: [{
            showInLegend: false,
            name: 'Series',
            data: value                
        }]

but it hide the legend. Please help...

Solution

  • You need to disable visible property for the first and the third series:

    series: [{
        name: 'Test1',
        visible: false,
        data: [...]
    },
    {
        name: 'Test2',
        data: [...]
    },
    {
        name: 'Test3',
        visible: false,
        data: [...]
    }
]

    Live demo: http://jsfiddle.net/BlackLabel/qtmh975p/

    API Reference: https://api.highcharts.com/highcharts/series.area.visible