0

I am creating a graph that should display data out of a database for each sensor that is in there. I had success when i set it to only 1 sensor but when I am trying to display a chart for each sensor in my database, there is no line showing.

I am using the following code:

// select all sensors in db
$sql = "SELECT * FROM sensoren";
$result = $link->query($sql);

if ($result->num_rows > 0) {
    // data of each row
    while($row = $result->fetch_assoc()) {
        $sensor = $row['sensor_id'];
        echo "<div id='sensor-$sensor' class='sensoren'>";
        echo "<div class='one-third'>";
        echo "<center><h4>Sensor</h4></center>";
        echo "<center><h4>$sensor</h4></center>";
        echo "</div>";
        echo "<div class='two-third'>";
            /* Database settings for selecting of values that the sensor send to db */
    $host = 'localhost';
    $user = 'casbek1q_system';
    $pass = 'JUITGhJ>NKIL^';
    $db = 'casbek1q_system';
    $mysqli = new mysqli($host,$user,$pass,$db) or die($mysqli->error);

    $data1 = '';
    $data2 = '';

    // select data from each sensor in db
    $sql2 = "SELECT * FROM `metingen` WHERE sensorid = '$sensor' ORDER BY id ASC LIMIT 10 ";
    $result2 = mysqli_query($mysqli, $sql2);

    // setting them in array
    while ($row2 = mysqli_fetch_array($result2)) {

        $data1 = $data1 . '"'. $row2['waarde'].'",';
        $data2 = $data2 . '"'. $row2['timestamp'].'",';

    }
    // removing last comma
    $data1 = trim($data1,",");
    $data2 = trim($data2,",");
?>
<div class="container"> 
        <h4>Laatste metingen van Sensor <?php echo $sensor ?></h4>        
            <canvas id="chart<?php echo $sensor;?>" style="width: 100%; height: 100%; background: #222; border: 1px solid #555652;"></canvas> <!-- giving each chart a unique ID -->
        <!-- stuk script van chart.js om de grafiek te maken -->
            <script>
                var ctx = document.getElementById(chart<?php echo $sensor;?>).getContext('2d');
                var myChart  = new Chart(ctx), {
                type: 'line',
                data: {
                    labels: [<?php echo $data2; ?>], // times from measurement
                    datasets: 
                    [{
                        label: 'Sensor <?php echo $sensor;?>', // give a name to line
                        data: [<?php echo $data1; ?>], // display measurements
                        backgroundColor: 'transparent',
                        borderColor:'rgba(255,99,132)',
                        borderWidth: 3
                    }]
                },

                options: {
                    scales: {scales:{yAxes: [{beginAtZero: false}], xAxes: [{autoskip: true, maxTicketsLimit: 20}]}},
                    tooltips:{mode: 'index'},
                    legend:{display: true, position: 'top', labels: {fontColor: 'rgb(255,255,255)', fontSize: 16}}
                }
            });
            </script>
<?php
        echo "</div>";
        echo "</div>";
        echo "</div>";
    } // end while loop, go to next sensor
}  

There should be a line in each graph, since i have 2 sensors in my database and multiple measurements for each sensor.

I got this problem when i tried to make a unique chart for each sensor, because documentGetElementById needed an unique id for each table.

  • What is `$link` and why do you seem to open another connection after called `$mysqli`? – Dharman Dec 25 '19 at 12:57
  • Please read: [Should we ever check for mysqli_connect() errors manually?](https://stackoverflow.com/q/58808332/1839439) – Dharman Dec 25 '19 at 12:57
  • @Dharman $link is from my dbconf file, otherwise known as $conn. $mysqli is from the piece of code i found on the internet how i can put values in a graph from a database. – Cas Bekhuis Dec 25 '19 at 16:07
  • @Dharman i know about SQL Injections and prepared statements, this is not something to go public. Only for personal use. – Cas Bekhuis Dec 25 '19 at 16:26
  • You already made it public by posting here. Why go for the wrong, buggy approach if you know how to do it properly anyway? You are shooting yourself in the leg whether it is just for you or more the whole world to use. – Dharman Dec 25 '19 at 16:29
  • Is there any js error in the console? Or what happens when you run the js? – Ali Khalili Dec 25 '19 at 19:36
  • @AliKhalili when i run it on my site, I see 2 'cavas' fields, but there is no line in them showing any data. When i inspect it, i see the correct times and values on it. – Cas Bekhuis Dec 26 '19 at 12:37
  • @Dharman there are no input fields where the user can modify the query. – Cas Bekhuis Dec 26 '19 at 12:38

0 Answers0