highcharts : 신기원 시간이 Xaxis에 제대로 연결되지 않았습니다.

Question

일치하지 않는 데이터가 들어올 때 (예 : 데이터를 수집하는 서버가 다운 된 경우) highcharts가 X를 올바르게 플롯하지 않습니다.
X가있는 동안 데이터가있는 것처럼 여전히 플롯됩니다.
실제로 데이터가있는 정확한 시간을 표시해야합니다.
다음은 바이올린입니다. http://jsfiddle.net/ZVwFK/
데이터 변수가 일치하지 않습니다!

누군가이 오류를 해결할 수있는 방법을 보여 줄 수 있습니까?

$(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' 
      } 
     } 
    }); 
}); 

});

Answer 1

하이 차트의 시간 데이터를 지정하는 데는 두 가지 방법이 있으며 문제에 대해 잘못된 방법을 사용하고 있다고 생각합니다. 데이터에 간격이있을 때 사용해야하는 두 번째 스타일입니다.

1. 만

   data: [2, 5, 3, 6, 1] 
   

   는 그런 다음 기간과 함께 제 계수의 시간 포인트를 지정할 때마다 포인트에 대한 값을 포함하는 공극이없는 조밀 한 배열. 예 :

   pointStart: Date.UTC(2013,1,12), // start point in milliseconds 
   pointInterval: 3600 // interval in milliseconds 
   

   이렇게하면 시간 길이간에 길이가 달라질 수 없습니다.

2. 두 차원 모두 시간 - 포인트 어레이

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

   데이터가 없다 곳에 갭을 가질 수있는 배열을 지정하는 방법이 측정.

는 기준을 참조 here 예를 here.