2013-07-11 83 views
3

我正在使用多軸,並設置了一個軸以使用最大軸。如果它是唯一顯示的軸,那麼max就可以正常工作,正是我想要的。但是,如果還顯示另一個軸,則第一個軸最大值可以更改爲更大的值。我怎樣才能讓它顯示出最大值,而不是最大值?帶多軸的高軸最大軸

看到這個去http://jsfiddle.net/bx9sB/。它有3個軸,溫度軸最大爲30. 取消所有的軸,然後單擊溫度。最大值是30,很好。點擊下一步顯示壓力軸。現在溫度軸已上升到35,而不是30。我怎樣才能得到它留在30

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      zoomType: 'xy' 
     }, 
     title: { 
      text: 'Average Monthly Weather Data for Tokyo' 
     }, 
     subtitle: { 
      text: 'Source: WorldClimate.com' 
     }, 
     xAxis: [{ 
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
       'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
     }], 
     yAxis: [{ // Primary yAxis 
      labels: { 
       formatter: function() { 
        return this.value +'°C'; 
       }, 
       style: { 
        color: '#89A54E' 
       } 
      }, 
      title: { 
       text: 'Temperature', 
       style: { 
        color: '#89A54E' 
       } 
      }, 
      opposite: true,     
      max: 30 

     }, { // Secondary yAxis 
      gridLineWidth: 0, 
      title: { 
       text: 'Rainfall', 
       style: { 
        color: '#4572A7' 
       } 
      }, 
      labels: { 
       formatter: function() { 
        return this.value +' mm'; 
       }, 
       style: { 
        color: '#4572A7' 
       } 
      } 

     }, { // Tertiary yAxis 
      gridLineWidth: 0, 
      title: { 
       text: 'Sea-Level Pressure', 
       style: { 
        color: '#AA4643' 
       } 
      }, 
      labels: { 
       formatter: function() { 
        return this.value +' mb'; 
       }, 
       style: { 
        color: '#AA4643' 
       } 
      }, 
      opposite: true 
     }], 
     tooltip: { 
      shared: true 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'left', 
      x: 120, 
      verticalAlign: 'top', 
      y: 80, 
      floating: true, 
      backgroundColor: '#FFFFFF' 
     }, 
     series: [{ 
      name: 'Rainfall', 
      color: '#4572A7', 
      type: 'column', 
      yAxis: 1, 
      data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
      tooltip: { 
       valueSuffix: ' mm' 
      } 

     }, { 
      name: 'Sea-Level Pressure', 
      type: 'spline', 
      color: '#AA4643', 
      yAxis: 2, 
      data: [1016, 1016, 1015.9, 1015.5, 1012.3, 1009.5, 1009.6, 1010.2, 1013.1, 1016.9, 1018.2, 1016.7], 
      marker: { 
       enabled: false 
      }, 
      dashStyle: 'shortdot', 
      tooltip: { 
       valueSuffix: ' mb' 
      } 

     }, { 
      name: 'Temperature', 
      color: '#89A54E', 
      type: 'spline', 
      data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6], 
      tooltip: { 
       valueSuffix: ' °C' 
      } 
     }] 
    }); 
}); 

回答

3

集alignTicks:假

例如:

http://jsfiddle.net/jlbriggs/bx9sB/4/

alignTicks:false 
+0

感謝這對jsfiddle的問題,也是這個jsfiddle http://jsfiddle.net/bx9sB/3/最小,最大在第三軸。 – user2573014

+0

如果網格線看起來很雜亂,通過將gridLineWidth設置爲0來隱藏輔助軸是個好主意。正如上面所使用的那樣。 –

0

您應該設置min參數爲0,那麼都應該正常工作。

http://jsfiddle.net/bx9sB/1/

+0

謝謝,這個工作:-) – user2573014

+0

嗯,這似乎並沒有爲第三工作軸。在http://jsfiddle.net/bx9sB/2/上,我爲壓力軸設置了最小值:1005,最大值:1025,但當顯示所有軸時,最大值爲1030。 – user2573014