SO tabs flot demo

by ryleyb

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/smoothness/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.js"></script>
        <div id="graphLoaderDiv"></div>

CSS

#graphLoaderDiv{
    width: 500px;
    height: 300px;
}

JavaScript

var income = [[0,3],[1,0],[2,3],[3,1],[4,2],[5,2],[6,2],[7,8],[8,0],[9,9],[10,9],[11,8]];
 
var data2 = [[0,-1],[1,0],[2,3],[3,5],[4,5],[5,1],[6,3],[7,8],[8,10],[9,9],[10,9],[11,2]];;

var data = [
        {
            data: income,
            color: '#409628',
            label:'Income',
            bars: {show: true, align:'center', barWidth:0.3}
        }    
    ];

var options = {
    xaxis: { ticks:[[0,'Bob'],[1,'Chris'],[2,'Joe']]}
};
    $.plot($("#graphLoaderDiv"), data, options);