Question

I’m playing around with FLOT with Ruby and I’m having a hard time passing the code to javascript; I know my javascript isn’t reading the data correctly from Ruby. I need some syntax help.

o={};
o= {'label' => "A", 'data' => @example.collect{|x| [Time.utc(x.date).to_i, x.num]}}
render :text => o.to_json

I have successfully rendered the output as such:

{“label”:”A”,”data”:[[1281225600,1.31],[1281225600,1.31],[1281225600,1.25]]}

The HTML outputs this data only.

My javascript is as follows:

 var obj = jQuery.parseJSON(text);
    var options = {
    lines: { show: true },
    points: { show: true },
    xaxis: { mode: "time",  timeformat: "%m/%d/%y",   minTickSize: [1, "day"]}
    };  

       var data = obj;            
      $.plot(placeholder,[data],options);

}

Answer 1

What you are missing is that Ruby puts out timestamps in the Unix format (i.e. seconds since the epoch 1281225600). Flot requires javascript timestamps, which count the milliseconds since the epoch, i.e. 1281225600*1000.

So in your Ruby code, your best bet is to do something like this:

o={};
o= {'label' => "A", 'data' => @example.collect{|x| [Time.utc(x.date).to_i*1000, x.num]}}
render :text => o.to_json

Or if you prefer, you could loop over the obj.data and do the multiplication on the Javascript side:

for (i=0;i<obj.data.length;i++){
    obj.data[i] = obj.data[i]*1000;
}