В настоящее время я пытаюсь показать диаграмму Google, которая заполнена информацией, которую я извлекаю из источника данных. У меня установлено соединение с базой данных, я могу запросить нужные данные и сохранить результаты в объекте json. У меня проблемы с отображением графика. Я близко, но пока нет. Вот что у меня есть в моем php-коде
`<?php
$mysqli =mysqli_connect('localhost', 'root', '', 'prueba');
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: ".mysqli_connect_error();
}
$sql = mysqli_query($mysqli, 'SELECT * FROM pizza');
if (!$sql) {
die("Error running $sql: " . mysql_error());
}
$results = array(
'cols' => array(
array('label' => 'Topping', 'type' => 'varchar'),
array('label' => 'cantidad', 'type' => 'number')
),
'rows' => array()
);
while($row = mysqli_fetch_assoc($sql))
{
$results = array(
'Topping' => $row['Topping'],
'cantidad' => $row['cantidad']
);
$results ['rows'][] = array('c' => array(
array('v' => $row['Topping']),
array('v' => $row['cantidad'])
));
}
$json = json_encode($results, JSON_NUMERIC_CHECK);
echo $json;
?>`
Затем мой HTML-код для диаграммы:
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
function drawChart() {
// Create the data table.
$.ajax({
url: 'http://localhost/cakesetup/pizza',
dataType: "json",
success: function (jsonData){
var data = new google.visualization.DataTable(jsonData);
// Set chart options
var options = {'title':'Distribucion de pizzas',
'width':800,
'height':600};
}
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
});
}
</script>
</head>
<body>
<!--Div that will hold the pie chart-->
<div id="chart_div"></div>
</body>
</html>
</div>
</div>
Когда я запускаю код, я получаю следующее: «{» Topping «:» Peperonni «,» cantidad «: 6,» rows «: [{» c «: [{» v «:» Peperonni «}, {» v «: 6}]}]}»
Заранее спасибо.
Проверьте свой URL
// Create the data table.
$.ajax({
url: 'http://localhost/cakesetup/pizza', // i dont think a url localhost will work. try cakesetup or /pizza
dataType: "json",
success: function (jsonData){
var data = new google.visualization.DataTable(jsonData);
// Set chart options
var options = {'title':'Distribucion de pizzas',
'width':800,
'height':600};
}
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
});
Других решений пока нет …