Highcharts - 以編程方式「翻轉」（反向）Y軸

我正在使用Highcharts在我正在處理的Web應用程序中。其中一個要求是用戶應能夠點擊按鈕並「翻轉」或反轉Y軸。

換言之 - 當用戶點擊一個按鈕 - y軸值應當翻轉從：

highest at the top/lowest at the bottom

到

lowest at the top/highest at the bottom

在首次創建圖表 - 這是可能的用「倒」 Y軸的特性：

http://api.highcharts.com/highcharts#yAxis.reversed

這裏的例子：http://jsfiddle.net/ZgVNS/

但是 - 如果我試圖用JavaScript使用選項對象（例如，點擊一個按鈕）編程做到這一點，它似乎不工作：

chart.options.yAxis.reversed = !chart.options.yAxis.reversed; 
chart.redraw();

這裏有一個的jsfiddle我成立了測試：http://jsfiddle.net/4JZxS/6/

這可能嗎？

在此先感謝！

來源

2013-01-07 mattstuehler

'@ oftopic'：這是我的jsfiddle或它沒有顯示加載的代碼？ –

@RicardoLohmann礦不在Chrome上工作。在Firefox中，我可以看到代碼。 –

可以使用Axis.update（）方法：

$(function() { 
    var chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container' 
     }, 
     xAxis: { 
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
     }, 
     yAxis: { 
      reversed: false 
     }, 
     series: [{ 
      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] 
     }] 
    }); 

    var reversed = chart.options.yAxis.reversed; 

    // the button action 
    $('#button').click(function() { 

     chart.yAxis[0].update({ 
      reversed: !reversed 
     }); 

     reversed = !reversed; 
    }); 
});

這裏的更新的JSFiddle：http://jsfiddle.net/4JZxS/15/

來源

2014-01-14 10:09:20 Hamund

我不認爲這是可能的。

我的建議是使用chart.destroy()摧毀圖表並創建新的一個在顛倒財產，想在這個fiddle

來源

2013-01-08 00:15:05

Highcharts - 以編程方式「翻轉」（反向）Y軸

回答

相關問題