JSFiddle - React, Tailwind, and code Playground

by mayuripatil185

HTML

<script src="http://code.shutterstock.com/rickshaw/vendor/d3.v2.js"></script>
<script src="http://code.shutterstock.com/rickshaw/rickshaw.min.js"></script>
<div id="throughput_chart"></div>

JavaScript

var arr=[10,20,80,50,30,40,60,20,10,90];
var arr1=[90,10,50,80,40,10,20,80,30,60]
var tv=50;
var throughput = new Rickshaw.Graph({
    element: document.querySelector("#throughput_chart"),
    width: "300",
    height: "200",
    renderer: "line",
    series: new Rickshaw.Series.FixedDuration([{
        name: 'one', color: 'gold'
    },{
        name: 'two', color: 'red'
    }], undefined, {
        timeInterval: tv,
        maxDataPoints: 10,
        timeBase: new Date().getTime() / 1000
    })
});


for(var i = 0; i < 10; i++){
    addRandomData(throughput);  
}

throughput.render();

function addRandomData(chart) {
    for(var i=0;i<10;i++)
    {
        var data = {
            one:arr[i],
            two:arr1[i]
        };
        chart.series.addData(data);
    }
}