如何检索Json数据并在Chart.Js上显示

Question

Hello everyone I am trying to retrieve some data from data.php then allowing my app.js to display the data via Chartjs.

The data that I want to display is feedbackrowcount & complainrowcount Which I already did a query to retrieve what I want from mysql.

Below is my data.php that does the query and the json data

<?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);
?>

This is app.js that display the chart. I believe the Data: is the key to not being able to display the chart on my webpage. Please help me to write the statement needed to retrieve data from data.php to app.js. Thank you so much!

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