C3 Line graph displaying hh:mm:ss

Question

Is this possible to do?

I have a lite graph that is tracking check in times for patients. This time might be coming back as 01:10:45 or 00:45:00 or something similar. And I'm trying to plot this on a graph so the receptionist can see how much time it takes for something to check into the clinic.

Initially I was just plotting this in minutes, but was just told that was not going to cut it. I couldn't find any documentation on this and I've tried everything I can think of.

This is kind of what my code looks like

waitAverage = []
for(looping through all my data here){
  waitAverage.push(moment(data[i].AverageWaitTime, "hh:mm:ss").format('HH.mm.ss')); //I have also tried formatting it like HH:mm:ss. I thought maybe decimals would help 
 waitAverage.unshift(label)
}

 arrayHolder.push(waitAverage); 

 c3.generate({
            bindto: '.timeline',
            data: {
                columns: arrayHolder,
                axes: {
                    data1: 'x'
                }
            },
            axis: {
                y: {
                    label: { // ADD
                        text: text,
                        position: 'outer-middle'
                    }
                },
                x: {
                    type: 'category',
                    categories: hour //This does exist I just didn't include the variable here
                }
            }
        });

Any help would appreciated!

Answer 1

For anyone who needs an answer for this I was able to figure it out!

In the axis you have to call the tick format function and do some weird rounding.

            axis: {
                y: {
                    label: { // ADD
                        text: text,
                        position: 'outer-middle'
                    },
                    tick: {
                        format: function (d) { 
                            return app.moment(Math.round(d*100)/100, "hh.mm").format('H:mm');
                        }
                    }
                },
                x: {
                    type: 'category',
                    categories: hour
                }
            }