2

ハイチャートのパーセント積み上げ縦棒グラフがあります。凡例アイテムをクリックすると、デフォルトでそのシリーズは非表示になるはずです。しかし、そのシリーズを非表示にするとともに、理想的には他のシリーズの y 値に影響を与えず、100% ではなく元の y 値で再描画する必要があるときに、別のシリーズを 100% にしてグラフを再描画します。ここにデモリンクがあります: http://jsfiddle.net/kanz3/

plotOptions: {
    series: {
        events: {
            legendItemClick: function(event) {
            var visibility = this.visible ? 'visible' : 'hidden';     
            //chart.series.stacking='normal'
            }
        },
        stacking: 'percent'
    }
}
4

2 に答える 2

0

グループ/シリーズの位置を維持する変換関数と追加のパラメーターによってそれを達成することができます。http://jsfiddle.net/kanz3/1/

 plotOptions: {
        series: {
            events: {
                legendItemClick: function (event) {

                    if(!this.options.hidden)
                    {
                        this.options.groupXY.x = this.group.translateX;
                        this.options.groupXY.y = this.group.translateX;
                        this.group.translate(1000,1000);
                        this.options.hidden = true;
                    }
                    else
                    {
                        this.group.translate(this.options.groupXY.x, this.options.groupXY.y);
                         this.options.hidden = false;
                    }

                    return false;

                }
            },
            stacking: 'percent'
        }
    },

    series: [{
        groupXY: {
            hidden:false,
            x: 0,
            y: 0
        },
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }, {
        groupXY: {
            hidden:false,
            x: 0,
            y: 0
        },
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
于 2013-03-06T12:24:44.793 に答える
0

One way is to re-calculate your series data to be percentages, and then plot them with stacking: stacked. A bit of a pain, but calculating the percentages for each pair shouldn't be too hard.

 plotOptions: {
        series: {
            events: {
                legendItemClick: function(event) {
                    //console.log(this);
                    var visibility = this.visible ? 'visible' : 'hidden';
                    //this.stacking= 'normal'
                    //chart.series.yaxis.max = 70;
                 // console.log(chart);
                    //chart.redraw = false;          
                 //chart.series.stacking='normal'
                   // chart.type='line'
                }
            },
            stacking: 'stacked'
        }
    },

    series: [{
        data: [50,50,50,50]        
    },
            {
        data: [50,50,50,50]        
    }]

http://jsfiddle.net/2bWMC/

于 2013-03-05T08:49:16.377 に答える