JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.flotcharts.org/flot/jquery.flot.js"></script>
<script src="http://www.flotcharts.org/flot/jquery.flot.time.js"></script>
<div id="placeholder1" style="width:600px; height:300px"></div>

JavaScript

var data = [
    [1384436902000, Math.random() * 100],
    [1384523302000, Math.random() * 100],
    [1384609702000, Math.random() * 100],
    [1384696102000, Math.random() * 100],
    [1384782502000, Math.random() * 100],
    [1384868902000, Math.random() * 100],
    [1384955302000, Math.random() * 100]
    ];


var plot = $.plot("#placeholder1", [data], {
        series: {
                lines: { 
                    show: true, 
                    fill: 0.1
                },
                points: { show: true, 
                    fill: 0.05 }
        },
        xaxis: 
        {    
            mode: "time",
            minTickSize: [1, "day"],
            ticks: 7,
            transform: function (v) { return -v; },
            inverseTransform: function (v) { return -v; }
        },
        grid: {             
            backgroundColor: { colors: [ "#fff", "#fff" ] },
            borderColor: "#ccc",
            borderWidth: {
                top: 1,
                right: 1,
                bottom: 1,
                left: 1
            },
            hoverable: true,
            clickable: true
        },
        legend: {
            labelBoxBorderColor: "#fff",
            position: "ne",
            margin: [0, 0]              
        }
    });