我正在尝试使用数据库中的值创建图表。 在服务器端,我将值抛出一个列表并将列表传递给客户端。 但不知何故,图表根本不会显示任何内容。
这是我的javascript代码:
$(document).ready(function () {
$("#but").click(function (e) {
getData();
});
});
function CreateTempChart(options) {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'chart',
type: 'line',
marginRight: 25,
marginBottom: 25,
zoomType: 'xy'
},
title: {
text: 'Temperature',
x: -20 //center
},
subtitle: {
text: '',
x: -20
},
xAxis: {
type: 'datetime',
categories: []
},
yAxis: {
title: {
text: 'in °C'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function () {
return '<b>' + this.options.name + '</b><br/>' +
this.x + ': ' + this.y;
}
},
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'top',
x: -50,
y: 40,
borderWidth: 0
},
series:[]
});
chart.addSeries(options);
};
function getData() {
$.ajax({
url: "BasicLine",
dataType: 'json',
type: "POST",
contentType: 'application/json; charset=utf-8',
cache: false,
success: function(result) {
var yo = JSON.parse(result);
var arr = [];
$.map(yo, function (item) {
var t = item.Time.replace("\/Date(", "").replace(")\/", "");
var obj = {
name: "Temperature",
data: item.Value,
categories: t
};
arr.push(obj);
});
var jsonArray = JSON.stringify(arr);
console.log(jsonArray);
CreateTempChart(jsonArray);
},
error: function () {
alert("oh no");
}
});
}
日志看起来像这样
[{"name":"Temperature","data":10.7,"categories":"1430408770000"},{"name":"Temperature","data":10.8,"categories":"1430408990000"},....]
有什么想法吗?我对js不太熟悉。