DBJ+FLOT

by dbjdbj

HTML

<div id="dbj_body" style="border: 0px solid;">	<link href="http://people.iola.dk/olau/flot/examples/layout.css" rel="stylesheet" type="text/css" /><script type="text/javascript" src="http://people.iola.dk/olau/flot/jquery.js" language="javascript"></script>
<script type="text/javascript" src="http://people.iola.dk/olau/flot/jquery.flot.js" language="javascript"></script>
<h3 id="counter"></h3>
<div id="placeholder" style="width: 600px; height: 300px; border: 0px solid;"></div>

JavaScript

$(function () {
    var flot = null , 
		new_dataset = function ( hF_, size_ ) {
			var d1 = [], d2 = [], size = size_ || 1400, hF = hF_ || (20 * Math.random()) ;
				for (var i = 0; i < size; i += hF ) {
					d1.push([i, Math.sin(i)]);
					d2.push([i, Math.cos(i)]);
		}
			return [d1,d2] ;
		},
		maxi = 1000,  
		$counter = $("#counter"),
		tid = setInterval ( function ()  {
				if ( 0 > maxi-- ) { clearInterval(tid); return; }
				$counter.html( "" + maxi ) ;
					flot = $.plot($("#placeholder"), new_dataset());
					flot.draw();
			}, 1 ) ;
});