Highcharts 动态加载数据

前言 ：首先 请自行到官网去下载js文件 http://www.hcharts.cn

后台传过来的数据格式：

{"钢联":[{"period":300,"time":"10:01:00","app_id":"123","app_name":"钢联","sessions":0},{"period":300,"time":"10:02:00","app_id":"123","app_name":"钢联","sessions":0},{"period":300,"time":"10:03:00","app_id":"123","app_name":"钢联","sessions":0},{"period":300,"time":"10:04:00","app_id":"123","app_name":"钢联","sessions":2},{"period":300,"time":"10:05:00","app_id":"123","app_name":"钢联","sessions":14}],"旅游族":[{"period":300,"time":"10:01:00","app_id":"test123","app_name":"旅游族","sessions":0},{"period":300,"time":"10:02:00","app_id":"test123","app_name":"旅游族","sessions":1},{"period":300,"time":"10:03:00","app_id":"test123","app_name":"旅游族","sessions":25},{"period":300,"time":"10:04:00","app_id":"test123","app_name":"旅游族","sessions":0},{"period":300,"time":"10:05:00","app_id":"test123","app_name":"旅游族","sessions":0}]}


下面 前台 获取数据 展示

<script type="text/javascript">
var chart;
$(document).ready(function() {
$("#home_active").addClass("active");
var datas = ""; //接收 series数据 切记数据符合[{},{}]
//加载app活跃度数据；
var app_sessions = [];//每分钟活跃度次数
var app_date = [];//时间段
$.ajax({
url: "${ctx}/mdrback/list",
type: "POST",
async: true,
data: {
"size": 5,
"endDate": new Date()
},
dataType: "json",
success: function(data) {
for (i in data) {
var app = data[i];
for (j in app) {
app_date[j] = app[j].time; //当前活跃时间段
app_sessions[j] = app[j].sessions; //活跃次数
}
datas += "{name: '" + i + "',data:[" + app_sessions + "]},"; //组装数据图
}

chart = new Highcharts.Chart({
chart: {
//设置曲线 线条类型
defaultSeriesType: 'spline',
//曲线图放到 id 为container的 div 中显示
renderTo: "container",

width: 600
},
title: {
text: 'App activity of the top five',
x: -20 //center
},
subtitle: {
text: 'Source: kitapps.com.cn',
x: -20
},
xAxis: {
categories: app_date
},
yAxis: {
title: {
text: 'Activity (/ second)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '(number)'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: eval("[" + datas.substring(0, datas.length - 1) + "]") //转换 成series的图片数据 接受数组[{},{}]数据
});
},
error: function(data) {
alert("load data error");
}
});
});
</script>


如有 不规范之处，还望指出 ，谢谢！