Time Series NaN errors

[zeemy23]

Hello! I've been unable to get the c3 time series example working. The chart loads, but there are no data points or x-axis values, and many NaN errors in the console. Is my syntax wrong?

this in the .hbs

{{c3-chart
        data=model
        axis=axis
    }}

and this in the route

App.SensorsRoute = Ember.Route.extend({
    model: function() {
        return {

            x: 'x',
            columns: [
                ['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
                ['data1', 30, 200, 100, 400, 150, 250],
                ['data2', 130, 340, 200, 500, 250, 350]
            ]

        };
    },
    axis: function() {
        return{

            x: {
                type: 'timeseries',
                tick: {
                    format: '%Y-%m-%d'
                }
            }

        };
    }
});

Thanks!

[Frozenfire92]

Try using data from your controller like this:

App.SensorsController = Ember.Controller.extend({

    testData: function () {
        return {
            x: 'x',
            columns: [
                ['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
                ['data1', 30, 200, 100, 400, 150, 250],
                ['data2', 130, 340, 200, 500, 250, 350]
            ]
        };
    }.property(),

    testAxis: function() {
        return{
            x: {
                type: 'timeseries',
                tick: {
                    format: '%Y-%m-%d'
                }
            }
        };
    }.property()

});

and then changing your template to:

{{c3-chart data=testData axis=testAxis}}

[Glavin001]

@zeemy23 did @Frozenfire92's solution work for you? If you're still having trouble let us know and I can reopen the issue.

[zeemy23]

That worked. Thanks for your help.

[shunchu]

👍 for the solution!