javascript — круговая диаграмма в chart.js с данными из json

Я рисую круговую диаграмму, используя данные из базы данных.
Моя база данных очень проста, но имеет структуру, отличную от всех примеров, которые я проверял. Так это выглядит так:

id | food | tickets
1  | 300  | 50

Я думаю, что столбец id не нужен, потому что больше записей не будет.

data.php

 <?php
//setting header to json
header('Content-Type: application/json');

require_once "../polaczenie.php";

//get connection
$mysqli = @new mysqli($host,$db_user,$db_password,$db_name);

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

//query to get data from the table
$query = sprintf("SELECT id,food, tickets FROM arch_kategorie ORDER BY id");

//execute query
$result = $mysqli->query($query);

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

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

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

//now print the data
print json_encode($data);
?>

Когда я проверяю результаты по localhost: //data.php, у меня есть это:
[{ «Пища»: «300», «билеты»: «50»}]

А теперь проблемная часть:

app.php

$(document).ready(function(){
$.ajax({
url : "data.php",
type : "GET",
success : function(data){
console.log(data);

var food= [];
var tickets= [];

for(var i in data) {
food.push(data[i].food);
tickets.push(data[i].tickets);
}

var ctx1 = $("#chartcanvas-1");

var data = {
labels : ["food", "tickets"],
datasets : [{
label : "Result",
data : food, tickets
backgroundColor : [
"#DEB887",
"#A9A9A9"],
borderColor : [
"#CDA776",
"#989898"],
borderWidth : [1, 1]
}]
};

var options = {
title : {
display : true,
position : "top",
text : "Pie Chart",
fontSize : 18,
fontColor : "#111"},
legend : {
display : true,
position : "bottom"}
};

var chart1 = new Chart( ctx1, {
type : "pie",
data : data,
options : options
});
});
},
error : function(data) {
console.log(data);
}
});

И конечно же html:

index.html

<style type="text/css">
#chart-container {
width: 80%;
height: auto;
}
</style>

<div class="chart-container">
<div class="chart-container">
<canvas id="chartcanvas-1"></canvas>
</div>
</div>