Ytukyg

I am building a sample application which retrieves data from sensors and plots it on a web page. What i am trying to do plot the data based on the user input but so far i am not able to get it done.

What i would like to achieve as an end result is the following:

The user will be presented with a dropdown menu to choose from all available devices and their respective parameters. Those parameters might be barometric pressure, temperature, humidity and so on. Based on that, a chart should be presented to the user when he or she submits the chosen variables.

What I have done so far is calling the mysql server and retrieve the data via API and plot it just for a single device and a single value without any user interaction functionality.

Here is how i statically retrieve the data:

$(document).ready(function() {

        $.ajax({

            url : "http://192.168.31.225/lora/api/get_data1.php",

            type : "GET",

            success : function(data){

                console.log(data);





          var Time = ;

          var temp = ;



          for(var i in data) {

            Time.push("" + data[i].time);

            temp.push(data[i].temp);

          }



          var chartdata = {

            labels: Time,

            datasets: [

              {

                label: "Temperature",

                fill: false,

                lineTension: 0.1,

                backgroundColor: "rgba(59, 89, 152, 0.75)",

                borderColor: "rgba(59, 89, 152, 1)",

                pointHoverBackgroundColor: "rgba(59, 89, 152, 1)",

                pointHoverBorderColor: "rgba(59, 89, 152, 1)",

                data: temp

              }          

            ]

          };



          var ctx = $("#mycanvas");



          var LineGraph = new Chart(ctx, {

            type: 'line',

            data: chartdata

          });

        },

        error : function(data) {

            console.log(data);

        }

      });

       });

The get_data1.php gets called which retrieves all of the available data from a single device. Here is the structure of the get_data1.php file

<?php

require_once(dirname(dirname(__FILE__)) . '/settings/mysqlhandler.php');



header('Content-Type: application/json');



$query = sprintf("SELECT * from Temperature");



$result = $con->query($query);



$data = array();

    foreach ($result as $row) {

        $data = $row;

}



$result->close();



$con->close();



print json_encode($data);

?>

Could you provide any pointers on how should I proceed?