json数据格式如下:

{"value":[23,4,24,95,27,35,93,63,75,17,13,93,54,71,61,14,13,14,29]}

需要highcharts的dark-blue.js文件

html文件格式如下:

<!doctypehtml><htmllang="en"><head><scripttype="text/javascript"src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script><scripttype="text/javascript"src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script><scripttype="text/javascript"src="http://cdn.hcharts.cn/highcharts/exporting.js"></script><scripttype="text/javascript"src="dark-blue.js"></script><script>$(document).ready(function(){$.getJSON('http://1.1.1.1:800/1.json',{},function(json_data){//左侧Javascript代码$(function(){$(document).ready(function(){Highcharts.setOptions({global:{useUTC:false}});varchart;$('#container').highcharts({chart:{type:'spline',animation:Highcharts.svg,marginRight:10,events:{}},title:{text:'流量图'},xAxis:{title:{text:'时间'},type:'datetime',tickPixelInterval:150},credits:{enabled:false},yAxis:{title:{text:'单位/M'},plotLines:[{value:0,width:1,color:'#808080'}]},tooltip:{formatter:function(){return'<b>'+this.series.name+'</b><br/>'+Highcharts.dateFormat("时间:"+'%m-%d%H:%M:%S',this.x)+'<br/>'+"数据:"+Highcharts.numberFormat(this.y,2);}},legend:{enabled:false},exporting:{enabled:false},series:[{name:'实时数据',data:(function(){//generateanarrayofrandomdatavardata=[],time=(newDate()).getTime(),length=((json_data.value).length)+1;$.each(json_data.value,function(i,value){data.push({x:time-length*1000,y:value});length--;});returndata;})()}]});});});});});</script></head><body><divid="container"></div></body></html>

最终展现效果如下: