Dynamic graph does not update

Question

I’m using the library Rgraph graphics HTML5, and should update dynamically together with the bank.

However, I would like the last data imputed in the bank to be placed on the chart, so if I inserted the value 10 in the bank, the line of the graph would stay at 10 until I insert another value, like 25, and the graph would jump.

But the chart is not making that jump immediately, if the last value is 10, and I inputo 25, it stays at 10 unless I update the page.

Follow the code excerpt:

function update ()
{
    // A global

    l$.ajax({
        type: "POST",
        url: "consulta.php",
        data: {},
        dataType: 'json',
        success: function (last)
        {
            line.originalData[0].push(last);
            line.originalData[0].shift();
            RGraph.SVG.redraw();
        }
    });
    setTimeout(function () { update() }, 50);
}
update();

Query file.php:

<?php 
 include("salvateste.php");
 $execute_again = mysqli_query($conexao, "Select * FROM tabelapi order by Evento desc"); 
 $lone = mysqli_fetch_object($execute_again); 
 $mostra_tudao[0] = $lone->Amperes; 
 echo json_encode($mostra_tudao[0]);
?>

Answer 1

This is happening because the PHP code that is in the same file that renders the graph, PHP is processed only once at the time of page loading, so to process repeatedly, it is necessary to call again and again.

The solution for your problem is an ajax request that brings the data, in a simple way, define a setInterval that makes a request every X seconds, and fill in the chart with this data:

The function:

function update ()
{
    $.ajax({
        type: "POST",
        url: "consulta.php",
        data: {},
        dataType: 'json',
        success: function (last)
        {
             line.originalData[0].push(last);
             line.originalData[0].shift();
             RGraph.SVG.redraw();
        }
    });
}

The PHP file that returns the number:

<?php 
$execute_again = mysqli_query($conexao, "Select * FROM tabelapi order by Evento desc"); 
$lone = mysqli_fetch_object($execute_again); 
$mostra_tudao[$i] = $lone->Amperes; 
echo json_encode($mostra_tudao);
?>

And in the file where it renders the graph, at the end of the file, add a setInterval calling the function (I left 1 second, the time does not matter, but do not leave too fast because it is unnecessary):

 setTimeout(function () { update() }, 1000);