Using dates in jQuery Flot display

30,499

You should multiply to 1000 and use:

xaxis: {
      mode: "time"
  }

I tested this way. I can post the full code if you need.

This is a little italian post about using flot to measure my baby's height and weight:

The project code is downloadable from here.

Unzip it and open the file peso_giulia.html . Here you can find the d3 series.

You can replace the line

,[(new Date("2009/12/29")).getTime(),67]

with the timestamp version

,[(1282688250 * 1000), 100]
Share:
30,499
tchaymore
Author by

tchaymore

Stanford Graduate Student

Updated on November 23, 2020

Comments

  • tchaymore
    tchaymore over 3 years

    I'm trying to use Flot to plot a graph with dates. I've followed the advice on this string: here but it doesn't seem to work for me. Here is my modified JavaScript (from that other question):

    $(document).ready(function () {
    
        var d1 = [[1262818800,100],[1262732400,100],[1262646000,100]]; 
    
        var d2 = [[1262818800,23],[1262732400,23],[1262646000,23]];
    
        $.plot($("#placeholder"), [{data:d1,lines:{show: true},label:"Mountain"},{data:d2,lines:{show: true},label:"Valley"}],{yaxis: {label:"cm"}},
        {xaxis: 
          {mode:"time",
          timeformat: "%M:%S"
     }
        });
    
    });
    

    I get a graph, but it doesn't convert the x-axis into dates, and the values on the x-axis don't even line up with what I've got in the data variables. I've even tried multiplying each datapoint by 1000 to convert to Javascript timestamps, but that didn't help either. I've also tried the following timeformat variables, in case that was the problem:

    "%M:%S", "%H:%S", "%y,%m,%d"
    

    But no luck. Any ideas?

  • tchaymore
    tchaymore almost 14 years
    Thanks so much. I had to do one more thing--there were too many '{' and '}' in the so I don't think the options for the x-axis were even processing properly. But I would still appreciate seeing your code.