rickshaw/tutorial/example_04.html

Rickshaw is a JavaScript toolkit for creating interactive time series graphs, developed at [Shutterstock](http://www.shutterstock.com)

<!doctype>
<link type="text/css" rel="stylesheet" href="../rickshaw.min.css">
<script src="../vendor/d3.min.js"></script>
<script src="../vendor/d3.layout.min.js"></script>
<script src="../rickshaw.min.js"></script>

<style>
#chart_container {
	position: relative;
	font-family: Arial, Helvetica, sans-serif;
}
#chart {
	position: relative;
	left: 40px;
}
#y_axis {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 40px;
}
</style>

<div id="chart_container">
	<div id="y_axis"></div>
	<div id="chart"></div>
</div>

<script>
var graph = new Rickshaw.Graph( {
	element: document.querySelector("#chart"),
	width: 540,
	height: 240,
	series: [ {
		data: [ { x: -1893456000, y: 92228531 }, { x: -1577923200, y: 106021568 }, { x: -1262304000, y: 123202660 }, { x: -946771200, y: 132165129 }, { x: -631152000, y: 151325798 }, { x: -315619200, y: 179323175 }, { x: 0, y: 203211926 }, { x: 315532800, y: 226545805 }, { x: 631152000, y: 248709873 }, { x: 946684800, y: 281421906 }, { x: 1262304000, y: 308745538 } ], 
		color: 'steelblue'
	} ]
} );

var x_axis = new Rickshaw.Graph.Axis.Time( { graph: graph } );

var y_axis = new Rickshaw.Graph.Axis.Y( {
	graph: graph,
	orientation: 'left',
	tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
	element: document.getElementById('y_axis'),
} );

graph.render();

</script>