문제

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TEST</title>
<script src="gauge.min.js"></script>
</head>

<?php 
        //maak verbinding met MySQL server:
        $link = mysqli_connect("localhost","root","","opc") 
        or die("Kan niet verbinden met de server " . mysqli_error($link));

        //Haal waarde uit de database:
        $query = "SELECT * FROM test" 
        or die("Er is een fout opgetreden" . mysqli_error($link));

        //Sla de waarde op.
        $result = $link->query($query);

        //toon informatie:

        while($row = mysqli_fetch_array($result)) 
        {
            $waarde2 = $row["waarde2"];
        }
?>

<body>    
    <canvas id="gauge1" width="400" height="400"        
        data-type="canv-gauge"
        data-title="OPC TEST"
        data-min-value="0"
        data-max-value="100"
        data-major-ticks="0 10 20 30 40 50 60 70 80 90 100"
        data-minor-ticks="10"
        data-stroke-ticks="true"
        data-units="RPM"
        data-value-format="3.0"
        data-glow="true"
        data-animation-delay="500"
        data-animation-duration="200"
        data-animation-fn="linear"
        data-colors-needle="#f00 #00f"
        data-onready="setInterval( function() { Gauge.Collection.get('gauge1').setValue( <?= $waarde2 ?>);}, 1000);"
    ></canvas>    
</body>    
</html>

It works perfectly and shows a gauge with the value from the mysql database (which updates itself every second with another value). Unfortunately the gauge keeps displaying the same number. Does anyone know how to fix this?

도움이 되었습니까?

해결책

Load the gauge and data pull into a DIV using AJAX and then update AJAX every **ms or seconds or whatever you need. Then it will just happen at the frequency you determine.

This is a quick and easy way to do it: Div Update

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top