====== PHP-Programmierkurs [8] - Datenbankabfragen & google charts ======
In diesem Lernpfad, erfährst du, wie du Daten mit google charts darstellen kannst.

<tabbox Verbindung>
**Verbindung aufnehmen**\\
Zunächst muss eine Verbindung zur Datenbank bestehen:
\\
<code php>
//php-code
$db_host="localhost";
$db_user="username";
$db_password="deinPasswort";
$db_database="nameDerDatenbank";

//Verbindung aufbauen
$verbindung = mysqli_connect($db_host, $db_user, $db_password, $db_database) or
die("Keine Verbindung möglich! " . mysqli_error($verbindung));
echo "Verbindung zum Datenbankserver / zur Datenbank hergestellt! <br />";
</code>
\\
  * Die Funktion  ''mysqli_connect()'' öffnet eine Verbindung zum MySQL-Datenbankserver. In den Klammern stehen vier Parameter:  Hostname, Benutzername,  Kennwort und  Tabellenname.
  * Der Rückgabewert der Funktion  ''mysqli_connect()'' ist eine Referenz auf die Verbindung. Diese Referenz wird anschließend für weitere Funktionen benötigt und daher in der Variablen  $verbindung gespeichert.
<tabbox Abfrage>
Nun kannst du Daten aus der Datenbank abfragen. Beachte: Für ein Liniendiagramm benötigst du mindestens zwei Attribute (einen y-Wert für die Zeitachse & einen x-Wert für die Datenpunkte).
<code php>
//php-code
$abfrage = "SELECT spaltenattribut1, spaltenattribut2 FROM tabellenname WHERE bedingung";
$ergebnis = mysqli_query($verbindung, $abfrage) or die("Tabellenabfrage fehlgeschlagen!");
</code>
<tabbox javascript>
In den body deines php-Dokuments, also **nicht** in die php-tags, kommt ein **script** (javascript):\\
<code javascript>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <div id="chart_div"></div> 
  <script>
           google.charts.load('current', {packages: ['corechart', 'bar']});
           google.charts.setOnLoadCallback(drawBarColors);

   function drawBarColors() {
      var data = google.visualization.arrayToDataTable([
        ['spaltenattribut1', 'spaltenattribut2'],
        <?php  
                          while($row = mysqli_fetch_array($ergebnis))  
                          {  
                               echo "['".$row["spaltenattribut1"]."', ".$row["spaltenattribut2"]."],";  
                          }  
						 
                          ?>
      ]);

      var options = {
        title: 'This is a title!',
        chartArea: {width: '50%'},
        colors: ['#b0120a', '#ffab91'],
        hAxis: {
          title: 'title for x-axis',
          minValue: 0,
		  maxValue: 5
        },
        vAxis: {
          title: 'title for y-axis'
        }
      };
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }

  </script>
</code>
  * ''['spaltenattribut1', 'spaltenattribut2'], <?php''   - Diesen Teil solltest du verändern: Ersetze spaltenattribut1 und spaltenattribut2 mit den tatsächlichen Spaltenattributen.
  * Genauso hier: ''echo "['".$row["spaltenattribut1"]."', ".$row["spaltenattribut2"]."],";'' - Diesen Teil solltest du verändern: Ersetze spaltenattribut1 und spaltenattribut2 mit den tatsächlichen Spaltenattributen. 
  * Weise dem Diagramm auch einen aussagekräftigen Titel zu und beschrifte die x- und die y-Achse.

Die gute und hilfreiche Dokumentation zu google charts: [[https://developers.google.com/chart/interactive/docs/quick_start]]
<tabbox Verbindung schließen>
Die Verbindung zur Datenbank wird durch den Aufruf der Funktion ''mysqli_close()'' wieder geschlossen.

<code php>
/* Verbindung schließen */
mysqli_close($verbindung);
</code>

</tabbox>

{{tag>[informatik thema php php-programmierkurs html lernpfad datenbank googlecharts]}}