highcharts轉換區域範圍爲多條線上的陰謀

需要一手破譯Highcharts方法。highcharts轉換區域範圍爲多條線上的陰謀

我輸入的數據有很多記錄，包含三個字段（時間戳，最小值，最大值），我想從中生成一個圖。目標是擁有兩條線，一條是最大時間比，另一條是最小時間比，這兩條線都在這一條曲線上。

我得到了一個區域範圍來工作(fiddle here)但如果我將繪圖類型更改爲樣條線，我只會得到一個線條圖，分鐘與時間（即忽略最後一個數據參數）。

同樣的事情發生在我混淆了Highcharts區域範圍的例子時，所以我猜測我的系列沒有被正確定義，但我沒有破譯正確的術語來弄清楚如何提出問題，但我猜。任何幫助讚賞....

// data is timestamp,min,max for the day 
// - this currently plots only the min for each day 
// - intent is two lines, one for min and one for max 

var data = [ 
    [1186124400000, 57.2, 75.6], 
    [1186210800000, 51.8, 74.7], 
    [1186297200000, 53.8, 74.8], 
    [1186383600000, 56.7, 72.7], 
    [1186470000000, 59.0, 76.1] 
]; 

var options = { 
    chart: { 
     renderTo: 'container', 
     type: 'arearange' 
    }, 
    title: { 
     text: 'historical temperatures' 
    }, 
    xAxis: { 
     type: 'datetime' 
    }, 
    yAxis: { 
     title: { 
      text: 'outsideTemp (F)' 
     } 
    }, 
    legend: { 
     enabled: false 
    }, 
    series: [{ 
     legend: { 
      enabled: false 
     }, 
     data: data 
    }] 


}; 

    $(document).ready(function() { 
    var chart1 = new Highcharts.Chart(options) 


});

來源

2014-02-07 user3285738

您需要創建兩個單獨的系列。

因此，這：

var data = [ 
    [1186124400000, 57.2, 75.6], 
    [1186210800000, 51.8, 74.7], 
    [1186297200000, 53.8, 74.8], 
    [1186383600000, 56.7, 72.7], 
    [1186470000000, 59.0, 76.1] 
];

將需要兩個分開的陣列，每個陣列具有單一的y值，並且相同的x值：

var data1 = [ 
    [1186124400000, 57.2], 
    [1186210800000, 51.8], 
    [1186297200000, 53.8], 
    [1186383600000, 56.7], 
    [1186470000000, 59.0] 
]; 
var data2 = [ 
    [1186124400000, 75.6], 
    [1186210800000, 74.7], 
    [1186297200000, 74.8], 
    [1186383600000, 72.7], 
    [1186470000000, 76.1] 
];

更新Fiddle：

http://jsfiddle.net/jlbriggs/5q5HJ/12/

如果你的X值是在一致的時間間隔，您可以使用pointStart和pointInterval性能和跳過指定的x值

來源

2014-02-08 13:02:48 jlbriggs

highcharts轉換區域範圍爲多條線上的陰謀

回答

相關問題