Highcharts: Masquer et afficher la légende

J'aimerais être en mesure d'activer /désactiver la visibilité de la légende d'un graphique lorsque l'utilisateur clique sur un bouton.

J'ai essayé de cacher la légende en utilisant les sans-papiers destroy() méthode, cependant lorsque j'essaie de rendre à nouveau la légende et c'est des éléments, les éléments s'affichent en haut à gauche de la carte au lieu de dans la légende. Les éléments ne semblent pas avoir l'un de leurs gestionnaires d'événements ci-joint (en cliquant sur un élément n'est plus active un de la série).

Est-il une meilleure façon de le faire? J'ai pour soutenir à la fois SVG et VML implémentations, donc suis à la recherche d'une solution qui s'adresse à la fois.

JSFiddle Exemple

$('#updateLegend').on('click', function (e) {
    var enable = !chart.options.legend.enabled;
    chart.options.legend.enabled = enable;

    if (!enable) {
        chart.legend.destroy(); //"hide" legend
    } else {
        var allItems = chart.legend.allItems;

        //add legend items back to chart
        for (var i = 0; i < allItems.length; i++) {
            var item = allItems[i];
            item.legendItem.add();
            item.legendLine.add();
            item.legendSymbol.add();
        }

        //re-render the legend
        chart.legend.render();
    }
});
en fait, il était encore possible de faire mieux. voir ma solution.

OriginalL'auteur cfs | 2013-07-25