Maison >base de données >tutoriel mysql >Comment générer des graphiques à l'aide de PHP, MySQL et l'API Google Charts ?
Comment générer des graphiques à l'aide de PHP, MySQL et l'API Google Charts ?
- Patricia Arquetteoriginal
- 2024-12-06 03:44:15278parcourir
PHP MySQL Google Chart JSON - Exemple complet
Cet exemple vous montre comment générer un graphique en utilisant PHP, MySQL et l'API Google Chart .
Prérequis :
- PHP, Apache et MySQL
Configuration de la base de données :
- Utilisez phpMyAdmin pour créer un fichier appelé Base de données pour "graphique".
- Créez un tableau appelé "googlechart" et assurez-vous qu'il contient au moins deux colonnes. Par exemple : tâche_hebdomadaire et pourcentage.
- Insérez quelques données dans un tableau où la colonne de pourcentage ne contient que des chiffres.
Graphique PHP-MySQL-JSON-Google Exemple :
$con = mysqli_connect("localhost", "Username", "Password") or die("Failed to connect with database!!!!");
mysqli_select_db("Database Name", $con);
$result = mysqli_query($con, "SELECT * FROM googlechart");
$rows = array();
$table = array();
$table['cols'] = array(
array('label' => 'Weekly Task', 'type' => 'string'),
array('label' => 'Percentage', 'type' => 'number')
);
while ($row = mysqli_fetch_assoc($result)) {
$temp = array();
$temp[] = array('v' => (string) $row['weekly_task']);
$temp[] = array('v' => (int) $row['percentage']);
$rows[] = array('c' => $temp);
}
$table['rows'] = $rows;
$jsonTable = json_encode($table);
echo $jsonTable;
?>
<html>
<head>
<!-- Load the Ajax API -->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages': ['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart() {
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(<?php echo $jsonTable; ?>);
var options = {
title: 'My Weekly Plan',
is3D: 'true',
width: 800,
height: 600
};
// Instantiate and draw our chart, passing in some options.
// Do not forget to check your div ID
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!-- this is the div that will hold the pie chart -->
<div>
Erreur causée par la syntaxe des balises courtes :
Certains utilisateurs peuvent rencontrer cette erreur localement ou sur le serveur :
syntax error var data = new google.visualization.DataTable(<?php echo $jsonTable; ?>);
Cela signifie que son environnement ne prend pas en charge les balises courtes. La solution de contournement consiste à utiliser la syntaxe suivante :
<?php echo $jsonTable; ?>
Tout devrait fonctionner correctement.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!