2

Highcharts Pie Chart スライスの選択状態をカスタマイズして、選択時に移動しないようにしようとしています。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

Highcharts サポート フォーラムのSebastian と Pawel の助けのおかげで、スライス アニメーションは "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 に答える