如何切換在highchart

傳奇佈局我有興趣的單擊事件改變傳說佈局如下如何切換在highchart

點擊水平 - 底部

第二點擊上部水平

點擊左邊的美德

4th點擊virtical右

我不知道如何可以做到這一點，這是我到目前爲止已經試過。

HTML

 <script src="http://code.highcharts.com/highcharts.js"></script> 
     <div id="container" style="height: 400px"></div> 
     <input id='legend' type='button' value='toggle legend'>

JAVASCRIPT

 $(function() { 
var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'container', 
     zoomType: 'xy', 
     marginLeft: 50, 
     marginBottom: 90 
    }, 

    yAxis: { 
     reversed: true, 
     //min: 0, 
     //max: 50 
    }, 
    plotOptions: { 
     series: { 
      stacking: 'normal' 
     } 
    }, 
    xAxis: { 
     opposite: true 
    }, 
    series: [{ 
     name: '01-Jan-2014', 
     data: [ 
      [28, 10], 
      [30, 0] 
     ] 
    }] 
}); 


var last = 0; 
$('#legend').click(function(){ 

    var arr = ['vertical','horizontal']; 
    if(last>arr.length){last=0;} 
    setTimeout(function() { alert(arr[last++]);},10); 
    chart.series[0].update({ legend: { layout: arr[last] }}); 

    }); 

    });

來源

2014-04-04 user3304642

這裏有一個辦法做到這一點here。我討厭訴諸設置內部dirty標誌，但它似乎運作良好：

var somePositions = [['center','bottom'], 
        ['center','top'], 
        ['left','middle'], 
        ['right','middle']]; 

$('#btn').click(function(){ 
     posIdx++; 
     if (posIdx == 4) posIdx = 0;     
     chart.legend.options.align = somePositions[posIdx][0]; 
     chart.legend.options.verticalAlign = somePositions[posIdx][1]; 
     chart.isDirtyLegend = true; 
     chart.isDirtyBox = true; 
     chart.redraw(); 
});

來源

2014-04-04 18:01:03 Mark

你是我的耶穌這次又一次你讓我快樂，它按預期工作，愛你...非常感謝..馬克.. – user3304642

您需要使用tranlsate（）函數，它允許移動SVG元素像傳奇。

var legend = chart.legend.group; 

     $('#btn').click(function(){ 
      legend.translate(0,0) 
     });

http://jsfiddle.net/F3cSa/1/

來源

2014-04-04 10:28:34

這動人的傳說只能移動到左上角我希望它在所有4個方向移動，如何可以做到這一點??? – user3304642

正如我在論壇上回答你的，我介紹瞭如何達成一個，所以你需要計算x/y位置並使用相同的功能來適應其他位置。 –

我試圖更改數字'legend.translate（[0,1]）''legend.translate（[0,100]）'沒有效果 – user3304642

如何切換在highchart

回答

相關問題