I am using a template built on Bootstrap 4 & 5. There is a line chart already featured, with hardcoded values being displayed.
Hardcoded values:
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="card overflowhidden number-chart">
<div class="body">
<div class="number">
<h6>SALES</h6>
<span>$500</span>
</div>
<small class="text-muted">19% compared to last week</small>
</div>
<div class="sparkline" data-type="line" data-spot-Radius="0" data-offset="90" data-width="100%" data-height="50px"
data-line-Width="1" data-line-Color="#604a7b" data-fill-Color="#a092b0">**1,4,2,3,6,2**</div>
</div>
</div>
And it looks like this visually:
Now, I have a MySQL database and I want to retrieve the data to display it on the line chart.
I removed the hardcoded values and added the MySQL query. Please tell me what I’m doing wrong because the retrieved data is not being displayed. My DB connection is ok.
<div class="row clearfix">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="card overflowhidden number-chart">
<div class="body">
<div class="number">
<h6>Water Level</h6>
<span><p></p><p></p></span>
</div>
<small class="text-muted">Last 2 Hours</small>
</div>
<div class="sparkline" data-type="line" data-spot-Radius="0" data-offset="90" data-width="100%" data-height="50px"
data-line-Width="1" data-line-Color="#604a7b" data-fill-Color="#a092b0">
**<?php
$sql2 = "SELECT water_level as water_level FROM `tbl_water_level` WHERE `date` > SUBDATE( NOW(), INTERVAL 2 HOUR)";
$result2 = mysqli_query($conn, $sql2);
$data = '';
while($data=mysqli_fetch_array($result2)){
echo '.$row["water_level"].';
}
?>**
</div>
</div>
</div>
</div>