area chart with positive and negative values

Draw an area chart with positive and negative values. example: http:cl.lyimage1D1K0Q2C3f1x

function drawChart() {
	var dataTable = new google.visualization.DataTable();
		dataTable.addColumn(\'date\', \'Date\');
		dataTable.addColumn(\'number\', \'Completed Project Budget - Completed Project Hours\');
		dataTable.addRows([
			[new Date(2008, 11, 19), -3.25],
			[new Date(2009, 0, 29), -3.50],
			[new Date(2009, 1, 20), -14.88],
			[new Date(2009, 2, 30), -33.00],
			[new Date(2009, 3, 9), 4.62],
			[new Date(2009, 4, 26), -58.00],
			[new Date(2009, 5, 16), -25.00],
			[new Date(2009, 6, 29), 8.00],
			[new Date(2009, 7, 11), -129.50],
			[new Date(2009, 8, 15), -37.00],
			[new Date(2009, 9, 5), -14.13],
			[new Date(2009, 10, 3), -82.50],
			[new Date(2009, 11, 29), 30.00],
			[new Date(2010, 0, 10), -197.00],
			[new Date(2010, 1, 2), -56.00],
			[new Date(2010, 2, 31), 46.50],
	]);
	  
	var data = new google.visualization.DataView(dataTable);

	var options = {
		lineWidth:1,
		hAxis: {
			baselineColor:\'transparent\',
			gridlines: {
				color: \'transparent\'
			}
		},
		vAxis: {
			baselineColor: \'#ccc\'
		},
		pointSize: 2,
		chartArea: {width:\'98%\',height:\'100%\',top:0,left:\'1%\'},
		series: {
			0: {color: \'#922D8D\', visibleInLegend: false, lineWidth:1, areaOpacity: 0.5},
		},
		fontName: \'proxima nova\',
		tooltip: {
			textStyle: {
				color: \'#333333\', 
				fontSize: 12
			}
		},
		height: \'100%\',
		width: \'100%\',
		backgroundColor: \'transparent\',
	};

	var chart = new google.visualization.AreaChart(document.getElementById(\'graph\'));
	chart.draw(data, options);
}