Hallo Liebe Gemeinde,
ich bin gerade sehr am verzweifeln, da ich Probleme damit habe Daten aus meiner Datenbank in einem Diagramm ausgeben zu lassen.
Die Verbindung von Php an die mysql Datenbank steht bereits und funktioniert...
Beim Aufrufen der php-Datei auf dem localhost Server werden alle Daten ausgegeben.
Ich möchte die Daten in der Uhrzeit als Werte für die x-Achse für das Diagramm benutzen und "c" als Werte für die y-Achse.
Ich habe folgendes probiert und mit vorgegeben Arrays probiert und der Graph wurde gezeichnet, weiß aber nicht wie ich die Daten aus der php Datei in das Javascript bekomme.
Ich habe schon mehrere Möglichkeiten ausprobiert, aber schaffe es einfach nicht die Daten zu übertragen...
Javascript-Datei:
Danke schonmal!
Beste Grüße,
Julian
ich bin gerade sehr am verzweifeln, da ich Probleme damit habe Daten aus meiner Datenbank in einem Diagramm ausgeben zu lassen.
Die Verbindung von Php an die mysql Datenbank steht bereits und funktioniert...
PHP-Code:
<?php
$db = new mysqli('localhost', 'root', '', 'crowd') or die(mysql_error());
$query = sprintf("SELECT Uhrzeit, COUNT(Id) AS c FROM formular GROUP BY Uhrzeit ORDER BY c DESC ");
$result = $db->query($query);
$data = array ();
foreach ($result as $row) {
$data[] = $row;
}
$result->close();
$db->close();
print json_encode($data);
?>
Ich möchte die Daten in der Uhrzeit als Werte für die x-Achse für das Diagramm benutzen und "c" als Werte für die y-Achse.
Ich habe folgendes probiert und mit vorgegeben Arrays probiert und der Graph wurde gezeichnet, weiß aber nicht wie ich die Daten aus der php Datei in das Javascript bekomme.
Ich habe schon mehrere Möglichkeiten ausprobiert, aber schaffe es einfach nicht die Daten zu übertragen...
Javascript-Datei:
HTML-Code:
<script> var one = document.getElementById('myChartOne'); // Element aus der Statistik.html übernehmen zum Zeichnen var barone = new Chart (one,{ type: 'bar', data: { labels: HIER SOLLTE DIE UHRZEIT HIN, datasets: [{ label: "Uhrzeit", backgroundColor: 'rgba(65,105,225,0.4)', borderColor: 'rgba(65,105,225,1)', data: HIER SOLLTE DIE HÄUFIGKEIT c HIN },] }, options: { scales: { yAxes: [{ ticks: { beginAtZero:true } }] } } }); </script>
Beste Grüße,
Julian
Kommentar