如何制作图例标签以显示饼图的系列,并且在 HighCharts 中单击标签时不让它们消失?

How to make legend labels to bring out the series of a pie chart and not make them disappear when label is clicked in HighCharts?

我用 HighCharts 制作了以下图表 http://jsfiddle.net/dbahiense/enmqyv0p/

这里是js代码:

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'pie'
        },

        legend: {
            enabled: true,
            layout: 'vertical',
            align: 'left',
            useHTML: true,
            verticalAlign: 'middle',
        },

        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                showInLegend: true
            }
        },

            legend: {
                enabled: true,
                layout: 'vertical',
                align: 'left',
                useHTML: true,
                verticalAlign: 'middle',
            },

        series: [{
            data: [
                ['Firefox',   44.2],
                ['IE7',       26.6],
                ['IE6',       20],
                ['Chrome',    3.1],
                ['Other',    5.4]
            ]
        }]
    });
});

当我直接点击图表上的任何系列它的标签时(通过彩色细线连接到图表)馅饼的相应部分移出,当我再次单击它时,它会移入。在另一侧,当我单击 图例 时,馅饼的相应系列 disappears/appears .我知道这是我们应该期待的。

我真正想知道的是我必须做什么,所以当我点击图例的标签之一(左侧的浏览器列表)时,它并没有消失,而是移开了。

我已经尝试 change/insert legend.enable、plotOptions.pie.dataLabels、pie.selecte、pie.showInLegend 和选项但没有成功。

非常感谢!

您可以覆盖饼图点级别的图例项单击事件。 http://api.highcharts.com/highcharts#plotOptions.pie.point.events.legendItemClick

    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            showInLegend: true,
            point: {
                events: {
                    legendItemClick: function (event) {
                        event.preventDefault();
                        this.select();
                    }
                }
            }
        }
    }

在这里我阻止了默认值的发生并触发了点 select 事件。
http://jsfiddle.net/blaird/enmqyv0p/4/