Question

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

$(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]]        
    }]
});
});

请参阅Working Example。

以下示例说明如何更改所选切片的颜色，但这些设置为not documented，添加“半径”属性无效：

$(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]]        
    }]
    });
});

请参阅working example

是否有人设法禁用饼图切片选择动画，同时仅将填充颜色应用于所选切片？

Answer 1

感谢Sebastian和Pawel对Highcharts Support Forum的帮助，切片动画通过“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]]        
    }]
  });
});

请参阅working example

Answer 2

基本上，你想要的是每当你点击饼图时，你点击的切片就不应该出去了。所以这样做只是：

/**
 * Start a child process for pushing data
 * @param unknown_type $client
 */
private function startProcess($client) {
    $this->console("Start a client process");
    $pid = pcntl_fork();
    if($pid == -1) {
        die('could not fork');
    }
    elseif($pid) { // process
        $client->setPid($pid);
    }
    else {
        // we are the child
        while(true) {

            // check if the client is connected
            if(!$client->isConnected()){
                break;
            }

            // push something to the client
            $seconds = rand(2, 5);
            $this->send($client, "I am waiting {$seconds} seconds");
            sleep($seconds);
        }
    }
}

它将阻止该切片出去＆amp;无需设置任何 slicedOffset 这是JsFiddle

自定义Highcharts饼图选择状态，以便切片在选中时不会设置动画

2 个答案: