dimplejs timeseries is not plotting with timeaxis

Question

I have this jsfiddle: http://jsfiddle.net/Ra2xS/42/. I exactly have no idea where things are going wrong. Can anyone please have a look at the code and suggest the correction?

var dim = {"width":590,"height":450}; //chart container width
var data = [{"date":"2008-07-16T07:00:00.000000000+0000","units":0},{"date":"2008-07-16T08:00:00.000000000+0000","units":0.97},{"date":"2008-07-16T09:00:00.000000000+0000","units":0.96},{"date":"2008-07-16T10:00:00.000000000+0000","units":1.66},{"date":"2008-07-16T11:00:00.000000000+0000","units":1.56},{"date":"2008-07-16T12:00:00.000000000+0000","units":1.53},{"date":"2008-07-16T13:00:00.000000000+0000","units":1.99},{"date":"2008-07-16T14:00:00.000000000+0000","units":2.22},{"date":"2008-07-16T15:00:00.000000000+0000","units":1.20},{"date":"2008-07-16T16:00:00.000000000+0000","units":0.10}];

function barplot(id,dim,data)
{
    keys = Object.keys(data[0]);
    var xcord = keys[0];
    var ycord = keys[1];
    var svg = dimple.newSvg(id, dim.width, dim.height);

    var myChart = new dimple.chart(svg,data);
    myChart.setBounds(60, 30, 505, 305);        
    var x = myChart.addTimeAxis("x", xcord, "%Y-%m-%dT%H:%M:%S.%LZ","%Y-%m-%dT%H:%M:%S.%LZ");

    x.addOrderRule(xcord);
    x.showGridlines = true;
    x.timePeriod = d3.time.hours;

    var y = myChart.addMeasureAxis("y", ycord);
    y.showGridlines = true;
    y.tickFormat = ',.2f';    

    var s1 = myChart.addSeries(null, dimple.plot.line);
    s1.lineWeight = 3;
    s1.lineMarkers = true;

    myChart.draw(1500);    
}

barplot("body",dim,data);

Answer 1

The input format for date is wrong. It should be:

%Y-%m-%dT%H:%M:%S.%L000000+0000

http://jsfiddle.net/Ra2xS/43/