我正在尝试绘制此json提供的数据,但它根本没有更新。
这是json:
{
"t1": {
"temps": "1850,1875,1900,1931,1956,1987,2000,2018,2031,2043,2100",
"times": "2019-04-10 13:27:09,2019-04-10 13:32:09,2019-04-10 13:37:10,2019-04-10 13:42:10,2019-04-10 13:47:12,2019-04-10 13:52:13,2019-04-10 13:57:13,2019-04-10 14:02:14,2019-04-10 14:07:14,2019-04-10 14:12:15,2019-04-10 14:29:52"
},
"t10": {
"temps": "1843,1868,1900,1925,1950,1975,1993,2012,2300",
"times": "2019-04-10 13:27:09,2019-04-10 13:32:09,2019-04-10 13:37:10,2019-04-10 13:42:10,2019-04-10 13:47:12,2019-04-10 13:52:13,2019-04-10 13:57:13,2019-04-10 14:02:14,2019-04-10 14:29:52"
},
"t2": {
"temps": "2131",
"times": "2019-04-10 14:29:52"
},
"t3": {
"temps": "1856,1881,1906,1931,2131",
"times": "2019-04-10 13:27:09,2019-04-10 13:32:09,2019-04-10 13:37:10,2019-04-10 13:42:10,2019-04-10 14:29:52"
},
"t4": {
"temps": "2125",
"times": "2019-04-10 14:29:52"
},
"t5": {
"temps": "2118",
"times": "2019-04-10 14:29:52"
},
"t6": {
"temps": "2075",
"times": "2019-04-10 14:29:52"
},
"t7": {
"temps": "2137",
"times": "2019-04-10 14:29:52"
},
"t8": {
"temps": "2112",
"times": "2019-04-10 14:29:52"
},
"t9": {
"temps": "2100",
"times": "2019-04-10 14:29:52"
}
}
我想要每个tX
的折线图。
我尝试了以下代码:
var ctx = document.getElementById('myChart').getContext('2d');
var dataResult = [1,2,3,4,5];
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ['-40min', '-30min', '-20min', '-10min', '-5min', '0'],
datasets: [
{
data: dataResult,
backgroundColor: [
'rgba(0, 0, 0, 0.05)'
],
borderColor: [
'rgba(0, 0, 0, 0.3)'
],
borderWidth: 2
}
]
},
options: {
responsive: true,
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}]
}
}
});
var getData = function() {
$.ajax({
url: 'https://www.example.com/get.php?chart=true',
dataType: "json",
success: function(data) {
myChart.data.datasets.forEach((data) => {
var nums = data.temps;
nums = nums.split(',').map(Number);
myChart.datasets.data.push(nums);
});
myChart.update();
}
});
}
setInterval(getData, 10000);
为什么不更新图表?我确实看到了1,2,3,4,5
的测试数据,但是tX
的每个数据的新值并未添加到图表中。似乎我在遍历每个tX
错误,但是我看不出我还能怎么做。