Php和Html图表使用Canvas.js使用mysql数据库

I am trying to fetch data from mysql database and plot a line graph using canvas.js way.....I just want to know how to pass values which I have fetched from database into the dataPoints: x and y values....i;e..X will contain Time and Y contains Temperature.I am trying to plot Time vs Temperature Graph here..

I have received these two data values from my database in php using this code.

$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;
}

Here when i give echo and see the r1 and r2 values I am able to see the database values....

--These are DateTime values from my database:

[[["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"]]]

--These are Temperature values from my database:

[[[25],[25],[28.91],[28.82],[28.84],[28.91],[29.05],[29.05],[28.92],[29.11]]]

Now i want to pass these varaibles to dataPoints: x and y as shown in below code:

<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>

Plz help me in this....

You can download CanvasJS Samples from this page, that includes rendering chart with data from mySQL database.

You need to parse data in the format which CanvasJS accepts. Check the code below

$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
.
.
});