Highcharts：在没有切片动画的情况下更改饼图部分的颜色

Question

考虑以下场景：

我有以下 fiddle 饼图，其中部分已经切片。 https://jsfiddle.net/amrutaJgtp/j2t0gdjt/4/

series: [{
    data: [
        {
        name: 'Jan',
        y: 29.9,
        sliced:true
        },
    {
        name: 'Feb',
        y: 71.5,
        sliced:true

        },
    {
        name: 'Mar',
        y: 106.4,
        sliced:true

        },
    {
        name: 'Apr',
        y: 100,
        sliced:true

    }
    ],
    slicedOffset:20
}]

在clicking/selecting任何部分（任意次数），我想在选择颜色和原始颜色之间切换部分颜色
但我没有将这些部分恢复到原来的 (0,0) 位置。也就是说，它们应该在 click/select

有办法实现吗？

Answer 1

您可以先使用点击事件select，然后确保在(JSFiddle):

之后切片

plotOptions: {
    pie: {
        point:{
            events:{
                click: function(event) {
                    this.select(!this.selected, true);
                    this.slice(true);
                    return false;
                }
            }
        }
    }
}

不幸的是，如果不使用累积的 select，这种方法效果不佳。找到一种方法可能会更好，您可以在其中设法禁用 slice 事件，然后是 select 事件。

Answer 2

我建议使用 point.events.unselect and call there point.slice(true). Something like this: https://jsfiddle.net/j2t0gdjt/9/

    plotOptions: {
        pie: {
            allowPointSelect: true,
            states: {
                select: {
                    color: '#ff0000'
                }
            },
            point:{
                events:{
                    unselect: function(event) {
                        this.slice(true);
                    }
                }
            }
        }
    },

Highcharts：在没有切片动画的情况下更改饼图部分的颜色

Highcharts: Change color of Pie Chart section without slice animation

javascript

highcharts

data-visualization

pie-chart