dygraph x-y plot with floating points for x-axis values

Question

I am trying to plot some multi-column x-y data. If the x-axis is an integer, then all is fine. But if the x-axis is a float (which is what I want), I get:

"Couldn't parse 2.214844 as a date"
...

as errors in the console. How do I plot floating points for x-axis?

Example of data:

2.214844,,,,,0.000000
2.224854,,,,0.000000,
2.234131,0.000000,,,,
2.264893,,,0.000000,,
2.273193,,0.000000,,,
104.372070,,,,0.000000,
104.376709,,,,,0.000000
104.398193,0.000000,,,,
104.498047,,,0.000000,,
104.577148,,0.000000,,,

My code so far:

g = new Dygraph(
            document.getElementById("graphdiv"),
            "./a.csv", 
          {
             labels: ['time','1','2','3','4','5'],
             visibility: [true, false, false,false,false],
             axes: { x: {
                          //valueParser: function(x) {return parseFloat(x);},
                          valueParser: function(x) {return parseInt(x);}
                        }
                   }
           });

I tried with and without the axis options.

Answer 1

You've found quite the bug! dygraphs decides whether your x-values are dates or numbers based on the first one ("2.214844"). In this case, because of an imprecise check, it gets it wrong.

This will get fixed in the next dygraphs release. But in the meantime, your options are either to:

1. Add or remove a single digit from that value, i.e. make it "2.2148440" with a zero on the end. (Seriously!)

2. Explicitly tell dygraphs that your x-axis is numeric.

This is what that would look like:

g = new Dygraph(
    document.getElementById("graph"),
    csv,
    {
       xValueParser: parseFloat,
       axes: {
         x: {
           valueFormatter: x => x,
           ticker: Dygraph.numericTicks,
           axisLabelFormatter: x => x,
         }
       }
    }
);

See full example.