1

I am using Apache2 to read data from mariadb in a Raspberry/Buster. First part of the image.php displays a table correctly. The second part intended to show a gauge, displays as blank area between the two printed dates. No error messages. Any visible coding faults or any idea of configuration faults or debugging hints?

<html>
//Table of data
<?php
// Attempt MySQL server connection.
$link = mysqli_connect("localhost", "triss", "noriko01?/", "test");
//Check connection
if($link == false)
{ die("ERROR: Could not connect. " . mysgli_connect_error()); }
// Print host information
echo "Connect Successfully. Host info: " . mysqli_get_host_info($link);
echo ("\n<br />\n<br />");?>
 
<table border="1" align="left">
</tr>
        <td>Day</td>
    <td>Read at</td>
    <td>Temp Cabin</td>
    <td>Temp Battery</td>
        <td>Humid Cabin</td>
        <td>Humid Battery</td>
</tr>

<?php

$query = mysqli_query($link, "SELECT * FROM  boat_status") or die (mysqli_error($link));

while ($row = mysqli_fetch_array($query)) {
    echo
    "<tr>
        <td>{$row['Day']}</td>
    <td>{$row['ReadAt']}</td>
    <td>{$row['TempCabin']}</td>
    <td>{$row['TempBattery']}</td>
        <td>{$row['HumidCabin']}</td>
        <td>{$row['HumidBattery']}</td>
    </tr>\n";
}

?>
</table>
</body>
</html>
<html>
<body>
<?php 
echo date('Y-m-d H:i:s'); 
echo ("\n<br />\n<br />"); ?>

<?php
    error_reporting(E_ALL);
    ini_set("display_errors", 1);
?>

//Gauge charts for Current temperature and  humidity
 <head>
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript">
   google.charts.load('current', {'packages':['gauge']});
   google.charts.setOnLoadCallback(drawChart);

   function drawChart() {
    var data = google.visualization.arrayToDataTable([
     ['Label', 'Value'],
     ['Temp Cabin', 80],
     ['Temp Battery', 80],
     ['Hum Cabin', 80]
    ]);

    var options = {
      width: 400, height: 120,
      redFrom: 40, redTo: 60,
      yellowFrom: 20, yellowTo: 40,
      minorTicks: 5
    };

    var chart = new google.visualization.Gauge(document.getElementById('chart_div'));

    chart.draw(data, options);

    setInterval(function() {
      data.setValue(0, 1, 40 + Math.round(60 * Math.random()));
      chart.draw(data, options);
    }, 13000);
    setInterval(function() {
      data.setValue(1, 1, 40 + Math.round(60 ' Math.random()));
      chart.draw(data, options);
    }, 5000);
    setInterval(function() {
      data.setValue(2, 1, 60 + Math.round(20 * Math.random()));
      chart.draw(data, options);
    }, 26000);
   }
  </script>

};
 </head>
 <body>
  <div id="chart_div" style="width: 400px; height: 120px;"></div>
 </body>
<?php 
echo date('Y-m-d H:i:s'); 
echo ("\n<br />\n<br />"); ?>

</html>
user12317410
  • 11
  • 2
  • 1
    You can't have more than one `body` – B001ᛦ Nov 12 '20 at 19:23
  • And you need a `` before you output any real HRML like that table – RiggsFolly Nov 12 '20 at 19:26
  • The element you were trying to find wasn’t in the DOM when your script ran. Browsers parse HTML documents from top to bottom. Elements are added to the DOM and scripts are (generally) executed as they're encountered. This means that order matters. Typically, scripts can't find elements which appear later in the markup because those elements have yet to be added to the DOM. See https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element for answer – avn Nov 12 '20 at 19:27
  • It is a very bad idea to use `die(mysqli_error($$conn));` in your code, because it could potentially leak sensitive information. See this post for more explanation: [mysqli or die, does it have to die?](https://stackoverflow.com/a/15320411/1839439) – Dharman Nov 12 '20 at 20:25
  • Thanks for quick response. What elements or scripts are coming in the wrong order? I cannot see it?! – user12317410 Nov 12 '20 at 20:53

0 Answers0