我试图从mysql数据库获取数据，并使用canvas.js方式绘制线图.....我只是想知道如何传递我从数据库中获取的值到数据点:x和y值.... I;e..X包含时间，Y包含温度。我试图在这里绘制时间与温度的关系图。
我已经收到了这两个数据值从我的数据库在php使用这个代码。
$sql1 = "SELECT Time FROM sdata ORDER BY ID DESC LIMIT 10;";
$response1 = mysqli_query($connect, $sql1) or die(mysqli_error($connect));
while($row1 = mysqli_fetch_all($response1)){
$r1[]= $row1;
}
$sql2 = "SELECT Temperature FROM sdata ORDER BY ID DESC LIMIT 10;";
$response2 = mysqli_query($connect, $sql2) or die(mysqli_error($connect));
while($row2 = mysqli_fetch_all($response2)){
$r2[]= $row2;
}
在这里，当我给出echo并看到r1和r2值时，我能够看到数据库值....
—这些是DateTime值从我的数据库:
[[["8/30/2016 37"],["8/30/2016 33"],["8/30/2016 32"],["8/30/2016 32"],["8/30/2016 32"],["8/30/2016 32"],["8/30/2016 32"],["8/30/2016 31"],["8/30/2016 31"],[" 8/30/2016 31 "]]]
—这些是我数据库中的温度值:
[[[25], [25], [28.91], [28.82], [28.84], [28.91], [29.05], [29.05], [28.92], [29.11]]]
现在我想传递这些变量给数据点:x和y，如下面的代码所示:
<script type="text/javascript">
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
title: {
text: "Line Chart"
},
axisX: {
interval: 5,
title: "Time",
valueFormatString: "hh:mm TT",
},
axisY: {
interval: 20,
title: "Temp"
},
data: [{
type: "line",
dataPoints: ???????????(HOW DO I PASS THE r1 and r2 values here for x and y respectively so that it give me a line chart is my question)
}]
});
chart.render();
}
</script>
请帮帮我....
您可以从本页下载CanvasJS示例，其中包括使用mySQL数据库中的数据绘制图表
你需要用CanvasJS接受的格式来解析数据。检查下面的代码
$r1=[[["8/30/2016 9:37"],["8/30/2016 9:33"],["8/30/2016 9:32"],["8/30/2016 9:32"],["8/30/2016 9:32"],["8/30/2016 9:32"],["8/30/2016 9:32"],["8/30/2016 9:31"],["8/30/2016 9:31"],["8/30/2016 9:31"]]];
$r2=[[[25],[25],[28.91],[28.82],[28.84],[28.91],[29.05],[29.05],[28.92],[29.11]]];
$dataPoints=array();
for($i=0;$i<count($r1[0]);$i++){
array_push($dataPoints,array('x'=> strtotime($r1[0][$i][0])*1000,'y'=>$r2[0][$i][0]));
}
var chart = new CanvasJS.Chart("chartContainer", {
.
.
dataPoints: <?php echo json_encode($dataPoints); ?> // edited
.
.
});