JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://nvd3.org/nv.d3.js"></script>
<link rel="stylesheet" href="http://nvd3.org/src/nv.d3.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div id="chart1">
    <svg></svg>
</div>

CSS

#chart1 svg {
  height:400px;
}

JavaScript

var width = 500,
    height = 500;

nv.addGraph(function () {
    var chart;
    chart = nv.models.lineChart().x(function (d) {
        return d.x;
    }).y(function (d) {
        return d.y;
    }).width(width).height(height);

    chart.xAxis.tickFormat(function (d) {
        return d3.time.format("%d-%m-%y")(new Date(d));
    });

    chart.yAxis.tickFormat(d3.format(',g'));
    d3.select('#chart1 svg').datum(data)
    //  .transition().duration(500)
    .call(chart).attr('width', width).attr('height', height);

    nv.utils.windowResize(chart.update);
    chart.dispatch.on('stateChange', function (e) {
        nv.log('New State:', JSON.stringify(e));
    });  

    return chart;
});



data = [{
    "values": [{
        "x": 1025409600000,
            "y": 0
    }, {
        "x": 1028088000000,
            "y": 0.09983341664682815
    }, {
        "x": 1030766400000,
            "y": 0.19866933079506122
    }, {
        "x": 1033358400000,
            "y": 0.29552020666133955
    }, {
        "x": 1036040400000,
            "y": 0.3894183423086505
    }],
        "key": "Line 1",
        "color": "#ff7f0e"
}, {
    "values": [{
        "x": 1025409600000,
            "y": 0.5
    }, {
        "x": 1028088000000,
            "y": 0.4975020826390129
    }, {
        "x": 1030766400000,
            "y": 0.4900332889206208
    }, {
        "x": 1033358400000,
            "y": 0.477668244562803
    }, {
        "x": 1036040400000,
            "y": 0.46053049700144255
    }],
        "key": "Line 2",
        "color": "#2ca02c"
}]