2

我正在尝试自定义 Highcharts 饼图切片的选择状态,以便在选择时不会移出。HighCharts选择状态文档为选择状态提供了“半径”选项,但这些设置对饼图没有影响:

$(function () {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        type: 'pie'
    },        
    plotOptions: {
        series: {
            allowPointSelect: true,
            marker: {
                states: {
                    select: {
                        radius: 0,
                        fillColor: '#666'
                    }
                }
            }
        }
    },

    series: [{
        data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]        
    }]
});
});​

请参阅工作示例

以下示例说明了更改所选切片的颜色,但未记录这些设置,并且添加“半径”属性无效:

$(function () {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        type: 'pie'
    },        
    plotOptions: {
        series: {
            allowPointSelect: true,
            states: {
                select: {
                    color: '#666'
                }
            }
        }
    },

    series: [{
        data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]        
    }]
    });
});​

查看工作示例

是否有人设法禁用饼图切片选择动画,同时仅对所选切片应用填充颜色?

4

2 回答 2

9

感谢 Sebastian 和 Pawel 在Highcharts 支持论坛上的帮助,切片动画通过“slicedOffset:0”设置禁用:

$(function () {
  var chart = new Highcharts.Chart({
    chart: {
      renderTo: 'container',
      type: 'pie'
    },        
    plotOptions: {
      series: {
        allowPointSelect: true,
        slicedOffset: 0,
        states: {
            select: {
                color: '#666'
            }
        }
    }
},

series: [{
    data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]        
    }]
  });
});​

查看工作示例

于 2012-12-04T17:43:27.063 回答
0

基本上,您希望无论何时单击饼图,您单击的切片都不会消失。所以简单地这样做:

allowPointSelect: false,

它将停止该切片出去并且无需设置任何slicedOffset 这是一个JsFiddle

于 2016-04-15T11:44:48.750 回答