第一种:静态数据
$('#THChartDiv').highcharts({
chart: {
type: 'spline'
},
title: {
text:过程线'
},
xAxis: {
title: {
text: 'X'
}
},
yAxis: {
title: {
text: 'Y'
}
},
tooltip: {
enabled: true,
formatter: function () {
return 'this.y + ',' + this.x;
}
},
legend: {
enabled: false
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
},
series: [{
name: 'XY',
data: [[3.9, 4.2], [5.7, 8.5], [8.9, 15.2], [17.0, 26.6], [34.2, 50.3], [46.6, 74.8]]
}]
});
chart = $('#THChartDiv').highcharts();
第二种:动态数据
动态数据有几种办法,
1:单独设置Ajax方法或者函数对data设值
(1)首先对chart设置空数据
series: [{
name: '水位',
data: []
}]
(2)再单独调用Ajax方法对chart重新赋值
$.ajax({
url: urlData,
success: function (data) {
//把后台返回的json字符串转换为json对象
var jsonData = eval("(" + data + ")");
//定义一个数组
var sdata = [];
//获取图形实例
var series = chart.series[0];
//迭代,把异步获取的数据放到数组中
var i = 0;
$.each(jsonData, function (i, d) {
//此处必须强制数据类型转换,否则有可能不能正确绘制图形
sdata.push([parseFloat(d.z), parseFloat(d.q)]);
});
//设置数据,重新绘制图形
series.setData(sdata);
}
});
2:chart在load事件中对data设值