highcharts：紀元時間未正確連接到Xaxis

當我有不一致的數據進來時（例如，收集數據的服務器關閉時）highcharts不會正確繪製X.
它仍然像陰影中有數據一樣沒有。
它應該在實際存在數據時繪製正確的小時。
這裏是小提琴：http://jsfiddle.net/ZVwFK/
數據變量不一致！highcharts：紀元時間未正確連接到Xaxis

有人可以告訴我如何糾正這個錯誤？

$(function() { 
var chart; 
$(document).ready(function() { 
    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'spline', 
      margin: [50,130,90,100] 
     }, 
     title: { 
      text: 'Weather Today' 
     }, 
     credits: { 
      enabled: false 
     }, 
     subtitle: { 
      text: 'test' 
     }, 
     xAxis: { 
      type: 'datetime', 
      dateTimeLabelFormats: { 
       day: '%H:%M' 
      }, 
      tickInterval: 3600 * 1000, 
      labels: { 
       rotation: -45, 
       align: 'right', 
       style: { 
        fontSize: '10px', 
        fontFamily: 'Verdana, sans-serif' 
       } 
      } 
     }, 
     yAxis: [{ 
      title: { 
       text: 'Temperature C' 
      }, 
      opposite: false, 
      minorGridLineWidth: 0 
      }, { 
      title: { 
       text: 'Humidity %' 
      }, 
      minorGridLineWidth: 0, 
      opposite: true 
      }, { 
      opposite: true, 
      title: { 
       text: 'Air Pressure hPa', 
       minorGridLineWidth: 0, 
      }, 
     }], 
     tooltip: { 
      formatter: function() { 
        if(this.series.name === 'Temperature') 
        { 
         return ''+ Highcharts.dateFormat('%H:%M',this.x) +': '+ this.y + ' C'; 
        } 
        if(this.series.name === 'Humidity') 
        { 
         return ''+ Highcharts.dateFormat('%H:%M',this.x) +': '+ this.y + ' %'; 
        } 
        if(this.series.name === 'Air Pressure') 
        { 
         return ''+ Highcharts.dateFormat('%H:%M',this.x) +': '+ this.y + ' hPa'; 
        } 
      } 
     }, 
     plotOptions: { 
      spline: { 
       lineWidth: 4, 
       states: { 
        hover: { 
         lineWidth: 3 
        } 
       }, 
       marker: { 
        enabled: false, 
        states: { 
         hover: { 
          enabled: true, 
          symbol: 'circle', 
          radius: 3, 
          lineWidth: 1 
         } 
        } 
       } 
      } 
     }, 
     series: [{ 
       name: 'Temperature', 
       data: temp, 
       type: 'spline', 
       /* yAxis: 0, */ 
       shadow: true, 
       showInLegend: true, 
       pointInterval: 60 * 1000, 
       /* pointStart: Date.UTC(2006, 0, 1),*/ 
       dashStyle: 'solid', 
       marker: { 
        enabled: false 
       } 
       } , { 
       name: 'Humidity', 
       data: hum, 
       yAxis: 1, 
       shadow: false, 
       showInLegend: true, 
       pointInterval: 60 * 1000, 
       type: 'line', 
       dashStyle: 'dot', 
       marker: { 
        enabled: false 
       } 
       }, { 
       name: 'Air Pressure', 
       data: bar, 
       yAxis: 2, 
       shadow: false, 
       showInLegend: true, 
       pointInterval: 60 * 1000, 
       type: 'line', 
       dashStyle: 'shortdot', 
       marker: { 
        enabled: false 
       } 
     }], 
     navigation: { 
      menuItemStyle: { 
       fontSize: '6px' 
      } 
     } 
    }); 
});

}）;

來源

2013-02-11 HyperDevil

有兩種方法可以爲Highcharts指定時間數據，我認爲您使用錯誤的方式解決問題。這是數據中存在差距時應使用的第二種方式。

緊湊數組而不只包含用於每個時間點的值
```
data: [2, 5, 3, 6, 1] 
```
然後就與間隔一起指定的時間點爲所述第一測量間隙。例如：
```
pointStart: Date.UTC(2013,1,12), // start point in milliseconds 
pointInterval: 3600 // interval in milliseconds 
```
這樣的時間點之間不能有不同的長度。

二維陣列與兩個時間點，並測量

data: [[Date.UTC(2013,1,12), 2], 
     [Date.UTC(2013,1,12), 5], 
     [Date.UTC(2013,1,12), 3], 
     ...]

指定陣列可以具有間隙，其中沒有數據的這種方式。

見參考here 和示例here。

來源

2013-02-12 10:02:07 eolsson

highcharts：紀元時間未正確連接到Xaxis

回答

相關問題