CODEWITHSUNDEEP
javascriptjqueryhighcharts
John
John

Reputation: 123

Highcharts manually setting legendItemClick event

I need to set the plotOptions -> events -> legendItemClick but manually on button click.

I though it would be something like chart.plotOptions.events.legendItemClick = function() {...}; but that obviously wasn't the solution.

I am not even sure if this is possible and I have to implement it on chart creation ONLY.

Any guidance on this is much appreciated. Thanks.

Setting in highcharts via creation:

plotOptions: {
    series: {
        events: {
            legendItemClick: function() {
                // Do something
            }
        }
    }
}

What I want to do... (Post creation)

var chart = $('#container').highcharts(); // Get the highcharts

// This doesn't work
chart.plotOptions.series.legendItemClick = function() { // Set the legendItemClick
    // Do something
}

Upvotes: 1

Views: 2309

Answers (1)

wergeld
wergeld

Reputation: 14462

We do it but within the legendItemClick itself. This work for us as we only have 2 states. The first is the initial load where we let the chart built with default legend click actions (all series are visible, clicking on a series in the legend hides that series, clicking on that series again shows it). The other state is when a user has selected a display option in a ddl that removes all but one series as being visible and then the user can click on a legend item and only show that item. We do it like:

function(event) {
    var e = document.getElementById('" & gModeElementId & "');
    var strGraphMode = e.options[e.selectedIndex].value;
    if (strGraphMode == 'single') {
        var seriesIndex = this.index;
        var serie = this.chart.series;
        for (i = 0; i < serie.length; i++) {
            if (serie[i].index == seriesIndex) {
                serie[i].show();
                var ctitle = this.chart.yAxis[0].axisTitle;
                ctitle.attr({text: serie[i].name});
            } else {
            serie[i].hide();
            }
        }
        return false;
    }
}

We also have not found a way to actually modify an existing legendItemClick function.

Upvotes: 4

Related Questions