Timestamp not accessed for Time series plot in C3.js

Question

I am trying to plot a time series graph for a given data with two columns, first having a Time-stamp and second is the respective voltage value at that time. Accessing the data file through C3.js url method and also specifying the parse format for the date-time. The output does not turn up. I don't know but, is it the way I am trying here is right? Kindly help me with it.

This is my C3 script:

        var chart=c3.generate({
               data: {
                   url: '/data/data.csv'
                   x: 'timestamp'
                   xFormat: '%m/%d/%Y %H:%M:%S %p' 
//                 My date format in .csv file is: 9/30/2015  6:38:00 PM
                   columns: [
                        ['timestamp', ... ],
                        ['voltage', ... ]
                    ]
               },
               axis: {
                    x: {
                        type: 'timeseries',
                        tick: {
                            format: function(x) {
                                retun x.getDate();
                            }
                        }
                    }
               }
            });

its not possible to tell you doing is rigt or wrong unless you put a working fiddle.. — Cyril Cherian, Jan 19 '16 at 06:51

WebFixItMan · Accepted Answer · 2016-03-03T02:41:05.697

After some experimentation I modified your code, added the commas (,) needed to separate the parameters, and I got your code snippet working. Here is the revised code:

var chart=c3.generate({
   data: {
       url: 'data/data.csv',
       x: 'timestamp',
       xFormat: '%m/%d/%Y %H:%M:%S %p',
        //~ My date format in .csv file is: 3/2/2016 6:44:00 PM
       columns: [
            ['timestamp'],
            ['voltage']
        ]
    },
    axis: {
        x: {
                type: 'timeseries',
                tick: {format: function (x) { return x.getHours(); }}
            }
        }
});

In the 'tick' parameter I believe you need to utilize JavaScript datetime methods such as 'getHours()' because you are trying to format the dates in that line, not get new dates. In my case the the output is in 0 to 24 hour increments.

Also, my data.csv file looks like this:

 timestamp,voltage
 3/2/2016 6:44:00 PM,30.893
 3/2/2016 4:57:00 PM,75.964
 3/2/2016 3:43:00 PM,96.37
 3/2/2016 2:38:00 PM,99.157
 3/2/2016 1:29:00 PM,85.335
 3/2/2016 11:16:00 AM,31.445

Timestamp not accessed for Time series plot in C3.js

1 Answers1