如何检索json数据并在chart.js上显示

li9yvcax  于 2021-06-15  发布在  Mysql
关注(0)|答案(0)|浏览(180)

大家好,我正试图从中检索一些数据 data.php 然后允许我 app.js 通过chartjs显示数据。
我要显示的数据是 feedbackrowcount & complainrowcount 我已经做了一个查询来从mysql检索我想要的东西。
下面是我的 data.php 它执行查询和json数据

<?php
//setting header to json
header('Content-Type: application/json');
$mysqli = mysqli_connect('localhost','root','','customercaremodule');

if(!$mysqli){
    die("Connection failed: " . $mysqli->error);
}

//query to get data from the table
$query1 = sprintf("SELECT FC_Category FROM fbcomplain where FC_Category ='Feedback'");
$Countsql1 = "SELECT count(FC_ID) AS total FROM fbcomplain WHERE FC_Category ='Feedback'";

//execute query
$result1 = $mysqli->query($query1);
$res1 = mysqli_query($mysqli,$Countsql1);
$value1 = mysqli_fetch_assoc($res1);
$feedbackrowcount = $value1['total'];
//loop through the returned data
$data1 = array();
foreach ($result1 as $row) {
    $data1[] = $row;
}

//free memory associated with result
$result1->close();

//query to get data from the table
$query2 = sprintf("SELECT FC_Category FROM fbcomplain where FC_Category ='Complain'");
$Countsql2 = "SELECT count(FC_ID) AS total FROM fbcomplain WHERE FC_Category ='Complain'";
//execute query
$result2 = $mysqli->query($query2);
$res2 = mysqli_query($mysqli,$Countsql2);
$value2 = mysqli_fetch_assoc($res2);
$complainrowcount = $value2['total'];

//loop through the returned data
$data2 = array();
foreach ($result2 as $row) {
    $data2[] = $row;
}

//free memory associated with result
$result2->close();

//close connection
$mysqli->close();

//now print the data
print json_encode($data1);
print json_encode($data2);
print json_encode($feedbackrowcount);
print json_encode($complainrowcount);
?>

这是 app.js 显示图表。我相信数据:是我无法在网页上显示图表的关键。请帮助我编写从data.php到app.js检索数据所需的语句。非常感谢!

$.getJSON('http://localhost/customercare/data.php', function(data) {
    console.log(data);
});

var oilCanvas = document.getElementById("oilChart");

Chart.defaults.global.defaultFontFamily = "Lato";
Chart.defaults.global.defaultFontSize = 18;

var feedbackvscomplainData = {
    labels: [
        "Feedback",
                "Complain"
    ],
    datasets: [
        {
            data:
            backgroundColor: [
                "#FF6384",
                                "#FF6300"
            ]
        }]
};

var pieChart = new Chart(oilCanvas, {
  type: 'pie',
  data: feedbackvscomplainData
});

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题