2014-05-12 79 views
2

我正在用Highstock繪製圖表。yAxis僅用一個系列計算

它顯示許多系列,yAxis是自動計算的,以顯示添加到圖表的每個系列。
但我的一個系列比其他人更重要。所以我想知道是否有可能只根據一個系列來計算我的yAxis,而不管其他系列的某些系列是否不在繪圖區域? (選項設置,功能覆蓋極值的計算...)

任何幫助表示讚賞。

+0

你知道在y最小值最大值您更重要意甲? – R3tep

+0

問題是,最小值和最大值取決於數據,並且數據也處於較長的日期範圍(可能超過10年)。最小值和最大值將隨用戶選擇的日期範圍而變化。 – zbMax

+0

[This](http://jsfiddle.net/6WJtS/)是你在找什麼?東京比紐約更重要 – R3tep

回答

2

用這種方法,必須知道更重要的系列的最小/最大值。

創建兩個Y軸,一個更重要的意甲和另一個看不見的:

yAxis : [ 
    { 
     title: { text: 'Temperature (°C)' }, 
     plotLines: [{ 
      value: 0, 
      width: 1, 
      color: '#808080' 
     }], 
     min: {{Min Value}}, 
     max: {{Max Value}}, 
     startOnTick: false 
    },{ 
     gridLineWidth: 0, 
     minorGridLineWidth: 0, 
     title: { text: '' }, 
     labels: { 
      style:{ display: 'none' } 
     }, 
     min: {{Same Min}}, 
     max: {{Same Max}}, 
     startOnTick: false 
    } 

] 

,並確定你用好y軸系列:

series: [{ 
      name: 'Tokyo', // More important serie 
      yAxis: 0, 
      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] 
     }, { 
      name: 'New York', // other serie 
      yAxis: 1, 
      data: [-40.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 124.1, 120.1, 114.1, 118.6, 2.5] 
     }] 

Live Demo

$(function() { 
 
    $('#container').highcharts({ 
 
    title: { 
 
     text: 'Monthly Average Temperature', 
 
     x: -20 //center 
 
    }, 
 
    subtitle: { 
 
     text: 'Source: WorldClimate.com', 
 
     x: -20 
 
    }, 
 
    xAxis: { 
 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
 
     'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' 
 
     ] 
 
    }, 
 
    yAxis: [{ 
 
     title: { 
 
     text: 'Temperature (°C)' 
 
     }, 
 
     plotLines: [{ 
 
     value: 0, 
 
     width: 1, 
 
     color: '#808080' 
 
     }, ], 
 
     min: -10, 
 
     max: 30 
 
    }, { 
 
     gridLineWidth: 0, 
 
     minorGridLineWidth: 0, 
 
     title: { 
 
     text: '' 
 
     }, 
 
     labels: { 
 
     style: { 
 
      display: 'none' 
 
     } 
 
     }, 
 
     min: -10, 
 
     max: 30 
 
    }], 
 
    tooltip: { 
 
     valueSuffix: '°C' 
 
    }, 
 
    legend: { 
 
     layout: 'vertical', 
 
     align: 'right', 
 
     verticalAlign: 'middle', 
 
     borderWidth: 0 
 
    }, 
 
    series: [{ 
 
     name: 'Tokyo', 
 
     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] 
 
    }, { 
 
     name: 'New York', 
 
     yAxis: 1, 
 
     data: [-40.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 124.1, 120.1, 114.1, 118.6, 2.5] 
 
    }] 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="http://code.highcharts.com/highcharts.js"></script> 
 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 
 

 
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>