Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flot charts x-axis time issues... AARGHHH

I am having a difficult time getting my data to display inside of a Flot chart with the x-axis serving as the timeline. Here is an abbreviated copy of my JSON file:

{
  "label": "ServiceReport",
  "data": [[1328983200, 53], [1328986800, 53], [1328990400, 60]]
}

I've followed the tutorials on the Flot API page, as well as this one on stackoverflow

without any luck.

When modifying the x-axis, this gets the graph to display just fine, but the x-axis is blank.

xaxis: { mode: "time", minTickSize: [1, "hour"]}

This displays 8 through 8 values (not correct according to data file), but no graph data:

xaxis: { mode: "time", minTickSize: [1, "hour"],
                min: (new Date("2000/01/01")).getTime(),
                max: (new Date("2000/01/02")).getTime()

            }

Basically, I just want to display the hours in (really any format: 5:00, 5 AM, doesn't matter) on the x-axis, and have the y-axis correlate to the Service Values. There are 24 total timestamps in each data file (one day's worth of data).

Any help from you Flot and JavaScript/jQuery experts would be greatly appreciated!!!

like image 966
mynameisneo Avatar asked Oct 23 '22 09:10

mynameisneo


1 Answers

First for the time to display, use :

 xaxis: { mode: "time",minTickSize: [1, "hour"],timeformat: "%H:%I:%S"}

I had the same problems with JSON data, caused by a bad JSON encoding file. Are you sure that your JSON file is really a JSON file ? Let's try something ike that to test it (with jquery for example) :

$.getJSON('yourJSONpage.php', 
    function(data) {
        testData=data.pop();
        alert(testData[0]);
});

Last point, your timestamp is not correct, correct time stamp is like that "1328983200000" not like that "1328983200", if you use PHP to generate your JSON data, make sure you do something like that for the dates :

$hour=mktime($h+1,$i,$s,$m,$d,$y)*1000;
like image 197
Valky Avatar answered Oct 27 '22 10:10

Valky