$(function() {
		
		var options = {
			legend: {
				show: true,
				margin: 10,
				backgroundOpacity: 0.5
			},
			grid: {
				hoverable: true
			},
			/*bars: {
				show: true
			},*/
			lines: {
				show: true
			},
			points: {
				show: true
			},
			yaxis: {
				autoscaleMargin: 0.2
			},
			xaxis: {
				mode: "time",
				timeformat: "%m/%y"
			}
		};
		
		function showTooltip(x, y, contents) {
			$('<div id="tooltip">' + contents + '</div>').css( {
				position: 'absolute',
				display: 'none',
				top: y - 40,
				left: x + 15,
				border: '1px solid #fdd',
				padding: '2px',
				'background-color': '#fee',
				opacity: 0.80
			}).appendTo("body").fadeIn(200);
		}

		var previousPoint = null;
		$("#plotarea1").bind("plothover", function (event, pos, item) {
			$("#x").text(pos.x.toFixed(2));
			$("#y").text(pos.y.toFixed(2));

			if (item) {
				if (previousPoint != item.datapoint) {
					previousPoint = item.datapoint;
					
					$("#tooltip").remove();
					var x = parseInt(item.datapoint[0].toFixed(2)),
						y = parseInt(item.datapoint[1].toFixed(2));
						
					var d = new Date();
					d.setTime(x);
					
					var m = new Array(12);
					m[0] = 'January';
					m[1] = 'February';
					m[2] = 'March';
					m[3] = 'April';
					m[4] = 'May';
					m[5] = 'June';
					m[6] = 'July';
					m[7] = 'August';
					m[8] = 'September';
					m[9] = 'October';
					m[10] = 'November';
					m[11] = 'December';
					
					showTooltip(item.pageX, item.pageY,
								m[d.getMonth()] + ' ' + d.getFullYear() + ':<br />' + y + ' ' + item.series.label);
				}
			}
			else {
				$("#tooltip").remove();
				previousPoint = null;            
			}
		});

		var plotarea1 = $("#plotarea1");
		plotarea1.css("height", "300px");
		plotarea1.css("width", "680px");
		
		$.plot( plotarea1 , dataset, options );
	});