CODEWITHSUNDEEP
phpflot
korvuss
korvuss

Reputation: 1

Flot.js with php and mysql not working with time

I have a system trying to display a graph of a count over time using flot js. The issue I am having is that the graph isnt actually rendering any lines. I have cast the time to UTC and multiplied by 1000 as suggested in other posts but to no avail. Does anyone have any idea what I am doing wrong?

PHP:

public function liveGraphAjax()
{   
    $query = "SELECT
                time as time,
                COUNT( id ) as count
            FROM table
            WHERE HOUR( TIME ) = HOUR( CURRENT_TIME ) -1
            GROUP BY DATE_FORMAT(`time`, '%H:%i')";
    $result = DB::select($query);       

    if(isset($result))
    {           
        $temp = array();
        foreach ($resultas $row )
         {  
            $temp [] = array(
                        'time' =>strtotime($row->time) * 1000,
                        'count' =>(int) $row->count,
                        );      
        }                   
    }

    return Response::json($temp);
}

JS:

var options = {
  colors : [$UpdatingChartColors],

  xaxis: {
         mode: "time", 
         timeformat:"%hh:%mm" 
  },
  series: {
           lines: { show: true },
           points: { show: true }
       },     
};

$("button.dataUpdate").click(function ()
{
  data = [];     

  $.plot("#updating-chart", data, options);

  function fetchData() 
  {

    function onDataReceived(series) 
    {
      var res = [];
      data = [series];

      for (var i = 0; i < data[0].length; ++i) 
      {
        res.push([data[0][i].time,data[0][i].count]);
      }

      console.log(res);
      $.plot("#updating-chart", res, options);
    }

    $.ajax({
      url: "liveGraphAjax",
      type: "GET",
      dataType: "json",
      success: onDataReceived
    });

  }

});

Upvotes: 0

Views: 107

Answers (1)

Raidri
Raidri

Reputation: 17550

  1. The fetchData() function is never called so you never get data.
  2. In your onDataReceived() function the res variable contains only one data series. You have to change your call to $.plot("#updating-chart", [res], options);

Upvotes: 1

Related Questions