[英]Data not displaying in Chart JS from PHP JSON
嗨,我正在嘗試使用Chartjs顯示動態折線圖,並使用PHP以JSON格式從SQL中提取數據。 數據已成功選擇,但不能僅顯示空白圖表,希望對您有所幫助。
$(document).ready(function() {
var dataPointsA = []
var dataPointsB = []
$.ajax({
type: 'GET',
url: 'data.php',
dataType: 'json',
success: function(field) {
for (var i = 0; i < field.length; i++) {
dataPointsA.push({
x: field[i].datetime,
y: field[i].roomtemp
});
dataPointsB.push({
x: field[i].datetime,
y: field[i].tanktemp
});
}
console.log(field);
var chartdata = {
title: {
text: "Fish Tank Monitor"
},
data: [{
type: "line",
name: "line1",
dataPoints: dataPointsA
}, {
type: "line",
name: "line2",
dataPoints: dataPointsB
}, ]
};
console.log(chartdata);
var ctx = mycanvas.getContext('2d');
var barGraph = new Chart(ctx, {
type: 'line',
data: chartdata,
backgroundColor: 'rgba(0, 119, 204, 0.3)'
});
}
});
});
JSON范例
[{"datetime":"2018-07-28 22:33:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:32:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:31:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:30:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:29:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:28:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:27:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:26:00.000","roomtemp":26.8,"tanktemp":28.4},{"datetime":"2018-07-28 22:25:00.000","roomtemp":26.9,"tanktemp":28.4},{"datetime":"2018-07-28 22:24:00.000","roomtemp":26.9,"tanktemp":28.4}]
我認為這是由於日期時間格式不正確而引起的。 您使用的datetime鍵充當字符串。 我認為您需要應用一個日期和時間過濾器
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.