Wsrtjtyk

I am trying to display in chart form some data on time series data using chart.js. The data is fetched from psql, converted to json, and sent as an argument to js function to render a chart.

The data is received properly in js but there are errors 'Uncaught RefernceError' about the js function call in HTML.

EDIT

It's raising these errors:

Uncaught RefernceError: dspChrt is not defined @ line

 dspChrt(WData);

    </script>          

        </body>

    </html>

Here is my code:

JS

<script>

    var Device_Data;

    var rssi, batt;

    var rssiArray = ;

    var battArray = ;

    var N = 12;

    for (i = 0; i < N; i++) {

        rssiArray.push(0);

        battArray.push(0); }



function dspChrt(Device_Data) { 



    console.log(Device_Data[0].rssi);

    console.log(Device_Data[1].battery_voltage_mv);

    rssi = Device_Data[0].rssi;

    batt = Device_Data[1].battery_voltage_mv;

    rssiArray.shift();

    rssiArray.push(rssi);

    battArray.shift();

    battArray.push(batt);



    var ctx = document.getElementById('myChart').getContext('2d');

    var myChart = new Chart(ctx, {

    type: 'line',

    data: {

    labels: [new Date()],

    datasets: [{

    label: 'rssi',

    data: rssiArray, 

    backgroundColor: "rgba(153,255,51,0.4)"

        }, {

    label: 'Battery_Voltage',

    data: battArray,

    backgroundColor: "rgba(255,153,0,0.4)"

    }]

    }

    options: {

    scales: {

        xAxes: [{

            type: 'time',

            time: {

                unit: 'hour',

            }

        }]

    }

}





}); 

}



 //var myVar = setInterval(dspChrt, 60000);

</script>

HTML/PHP

 <?php

    require("Connection.php");

    $stmt = $conn->prepare("Select date_time, battery_voltage_mv FROM measuring_device_statuses LIMIT 24");

    $stmt->execute();



    $result = $stmt->setFetchMode(PDO::FETCH_ASSOC);

    $WData = $stmt->fetchAll();



    /*

    echo "<pre>".print_r($WData, true)."</pre>"; 

    die();

    */



    ?>



    <script>

      var WData = <?php print_r(json_encode($WData));?>;

      //console.log(WData);

      dspChrt(WData);

    </script>



    </body>

</html>

When I looked at your code, I found labels were configured, however your timestamp format will never match those labels. As a result, showing 0 makes sense.

Not sure what do you want. Maybe something like this?
Take a look at the script they coded, you will find out they didn't configure labels.

If I were you, I might use scatter plot with showLines=true instead.