Untitled


<!doctype html> <html lang="en"> <head>
        <meta charset="utf-8">
        <title>Data</title>
        <meta name="description" content="The HTML5 Herald">
         <meta name="author" content="SitePoint">
        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="//cdn.jsdelivr.net/chartist.js/latest/chartist.min.css">
        <script src="//cdn.jsdelivr.net/chartist.js/latest/chartist.min.js"></script>
        <body>
          <h1>
                Licht en Temperatuur
          </h1>
          <?php
                        $servername = "localhost";
                        $username = "root";
                        $password = "ArneVetKop";
                        // Create connection
                        $conn = new mysqli($servername, $username,$password);
                        // Check connection
                        if ($conn->connect_error) {
                                die("Connection failed: " .
                                                        $conn->connect_error);
                        }
                        echo "Connected successfully";
                        $sql = "SELECT tijdstip, gradenCelcius, lichtintensiteit from data.oefening";
                        $result = $conn->query($sql);
                        if($result->num_rows > 0) {
                                echo "<table>";
                                $totaal = array();
                                $i = 0;
                                while($row = $result->fetch_assoc()) {
                                        echo "<tr><td>" . $i . "</td>";
                                        array_push($totaal, $row["gradenCelcius"]);
                                        echo "<td>" . $row["tijdstip"] . "</td>";
                                        echo "<td>" . $row["gradenCelcius"] . "°C</td>";
                                        echo "<td>" . $row["lichtintensiteit"] . "%</td></tr>";
                                        $i++;
                                }
                                echo "</table>";
                        } else {
                                echo "0 results";
                        }
                        $conn->close();

                ?>

                <div class="ct-chart ct-perfect-fourth"></div>

                        <script>
                                var gradendata = $.map(<?php echo json_encode($totaal); ?>, function(el) { return el});
                                arr = [];
                                for (var i = 0; i < gradendata.length; i++) {
                                        arr[i] = i.toString();
                                }

                                var data = {
                                        labels: arr,
                                        series: [
                                                gradendata
                                        ]

                                };
                                new Chartist.Line('.ct-chart', data);
                        </script>
        </body>
</html>