ajax를 사용하는 mysql의 하이 차트 데이터

데이터베이스 라이브의 데이터를 보여주는 선형 차트를 만들려고합니다.ajax를 사용하는 mysql의 하이 차트 데이터

약 100 마이크로 초마다 새로운 데이터를 데이터베이스에 저장했습니다.

저는 아약스를 사용하여 새 데이터를 확인합니다.

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script src="http://code.highcharts.com/highcharts.js"></script> 

<script type="text/javascript"> 
$(function() { 
    var chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container' 
     }, 
     xAxis: { 
      type: 'datetime', 
      tickPixelInterval: 150, 
      maxZoom: 20 * 1000 
     }, 

     series: [{ 
      name: 'Random data', 
      data: [] 
     }] 
    }); 

    $('#button').click(function() { 
     $.get('data.php', function(data) { 
     chart.series[0].setData(data); 
     }); 
    }); 
}); 
</script> 
    </head> 

    <body> 
    <div id="container" style="width: 100%; height: 400px"></div> 
    <button id="button">Set new data</button> 
    </body> 
</html>

data.php는 다음 반환 :

[ 
[Date.UTC(0000, 00, 00, 11, 11, 47, 7), 144], 
[Date.UTC(0000, 00, 00, 11, 11, 47, 17), 143], 
[Date.UTC(0000, 00, 00, 11, 11, 47, 29), 142], 
[Date.UTC(0000, 00, 00, 11, 11, 47, 39), 141], 
]

을하지만, 내 차트에 표시되지 않습니다

이

내 코드입니다.

이 작업을 도와 줄 수 있습니까?

출처

2012-06-05 user1436974

작동합니다. 나는 당신이 직면하고있는 이슈를 모른다. 하지만 내가 본 것은 데이터 사이의 시간 간격이 밀리 초이고 더 큰 눈금 간격을 제공한다는 것입니다.

틱 간격 (하이 차트가 자동으로 그려 지도록)과 maxzoomperiod를 삭제했습니다.

여기를 확인하십시오. http://jsfiddle.net/pLUza/

PS : 난 시리즈 옵션의 데이터 필드에 데이터를 삽입합니다. 그러나 AJAX를 사용할 때 그 결과가 어떻게 변하지 않을 지에 대한 것입니다.

출처

2012-06-12 11:50:15

ajax를 사용하는 mysql의 하이 차트 데이터

답변

관련 문제