dirocco/gist:5778948

## gistfile1.txt
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
var latAndLong = '40.736901,-73.990692'

function getJSONP(url, success) {

  var ud = '_' + +new Date,
		script = document.createElement('script'),
		head = document.getElementsByTagName('head')[0]
			|| document.documentElement;

	window[ud] = function(data) {
		head.removeChild(script);
		success && success(data);
	};

	script.src = url.replace('callback=?', 'callback=' + ud);
	head.appendChild(script);

}

google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback( drawChart );

function drawChart() {

	// get darksky data for union square, call charting callback
	getJSONP( 'https://api.darkskyapp.com/v1/forecast/YOUR API KEY GOES HERE/' + latAndLong + '?callback=?',
			function(data)  {
			   //console.log(data);

				summary = document.getElementById('weather_summary');
				summary.innerHTML = "Current weather: " + data['currentSummary'] + ", " + data['currentTemp'] + " degrees<br>";
				summary.innerHTML += "Today: " + data['daySummary'] + "<br>";
				if( data['minutesUntilChange'] != 0 )
					summary.innerHTML += "Next hour: " + data['hourSummary'] + "<br>";

				var hourchartdata = new google.visualization.DataTable();

				hourdata = data['hourPrecipitation'];

				hourchartdata.addColumn( 'datetime', "Time" );
				hourchartdata.addColumn( 'number', "Intensity" );
				hourchartdata.addColumn( {type:'string', role:'tooltip'} );
				for( var i = 0; i < hourdata.length; i++ )
				{
					var e = hourdata[i];
					hourchartdata.addRows([
							[ new Date( e['time'] * 1000 ), e['intensity'], e['probability'] + "% chance of " + e['type'] ]
							] );
				}


				var defaultoptions = {
					'width':600,
					'height':200,
					'vAxis': {
						'viewWindowMode':'explicit',
						'viewWindow': {
							'min':0.0,
							'max':120,
						},
					},
				};

				// Set chart options
				var houroptions = defaultoptions;
				houroptions['title'] = 'Next hour';
				houroptions['vAxis']['viewWindow']['max'] = 100;

				// Instantiate and draw our chart, passing in some options.
				var nexthourchart = new google.visualization.AreaChart(document.getElementById('nexthour_div'));
				nexthourchart.draw(hourchartdata, houroptions);


				// today's chart
				todaydata = data['dayPrecipitation'];

				var todaychartdata = new google.visualization.DataTable();
				todaychartdata.addColumn('datetime', "Time" );
				todaychartdata.addColumn('number', "chance of precipitation" );
				todaychartdata.addColumn('number', "temperature" );
				todaychartdata.addColumn('number', "humidity" );
				todaychartdata.addColumn( {type:'string', role:'toolTip'} );

				for( var i = 0; i < todaydata.length; i++ )
				{
					var e = todaydata[i];
					todaychartdata.addRows([
							[ new Date(e['time'] * 1000), e['probability'] * 100, e['temp'], e['relHumidity'] * 100, e['type'] ]
							] );
				}

				var todayoptions = defaultoptions;
				todayoptions['title'] = 'Today';
				todayoptions['vAxis']['viewWindowMode'] = 'pretty';
				todayoptions['focusTarget'] = 'category';

				var todaychart = new google.visualization.AreaChart( document.getElementById('today_div'));
				todaychart.draw( todaychartdata, todayoptions );
			} );
}

</script>
</head>
<body>
	<div id="weather_summary"></div>
	<div id="nexthour_div"></div>
	<div id="today_div"></div>

</body>
</html>
	<html>
	<head>
	<script type="text/javascript" src="https://www.google.com/jsapi"></script>
	<script type="text/javascript">
	var latAndLong = '40.736901,-73.990692'

	function getJSONP(url, success) {

	var ud = '_' + +new Date,
	script = document.createElement('script'),
	head = document.getElementsByTagName('head')[0]
	\|\| document.documentElement;

	window[ud] = function(data) {
	head.removeChild(script);
	success && success(data);
	};

	script.src = url.replace('callback=?', 'callback=' + ud);
	head.appendChild(script);

	}

	google.load('visualization', '1.0', {'packages':['corechart']});
	google.setOnLoadCallback( drawChart );

	function drawChart() {

	// get darksky data for union square, call charting callback
	getJSONP( 'https://api.darkskyapp.com/v1/forecast/YOUR API KEY GOES HERE/' + latAndLong + '?callback=?',
	function(data) {
	//console.log(data);

	summary = document.getElementById('weather_summary');
	summary.innerHTML = "Current weather: " + data['currentSummary'] + ", " + data['currentTemp'] + " degrees<br>";
	summary.innerHTML += "Today: " + data['daySummary'] + "<br>";
	if( data['minutesUntilChange'] != 0 )
	summary.innerHTML += "Next hour: " + data['hourSummary'] + "<br>";

	var hourchartdata = new google.visualization.DataTable();

	hourdata = data['hourPrecipitation'];

	hourchartdata.addColumn( 'datetime', "Time" );
	hourchartdata.addColumn( 'number', "Intensity" );
	hourchartdata.addColumn( {type:'string', role:'tooltip'} );
	for( var i = 0; i < hourdata.length; i++ )
	{
	var e = hourdata[i];
	hourchartdata.addRows([
	[ new Date( e['time'] * 1000 ), e['intensity'], e['probability'] + "% chance of " + e['type'] ]
	] );
	}


	var defaultoptions = {
	'width':600,
	'height':200,
	'vAxis': {
	'viewWindowMode':'explicit',
	'viewWindow': {
	'min':0.0,
	'max':120,
	},
	},
	};

	// Set chart options
	var houroptions = defaultoptions;
	houroptions['title'] = 'Next hour';
	houroptions['vAxis']['viewWindow']['max'] = 100;

	// Instantiate and draw our chart, passing in some options.
	var nexthourchart = new google.visualization.AreaChart(document.getElementById('nexthour_div'));
	nexthourchart.draw(hourchartdata, houroptions);


	// today's chart
	todaydata = data['dayPrecipitation'];

	var todaychartdata = new google.visualization.DataTable();
	todaychartdata.addColumn('datetime', "Time" );
	todaychartdata.addColumn('number', "chance of precipitation" );
	todaychartdata.addColumn('number', "temperature" );
	todaychartdata.addColumn('number', "humidity" );
	todaychartdata.addColumn( {type:'string', role:'toolTip'} );

	for( var i = 0; i < todaydata.length; i++ )
	{
	var e = todaydata[i];
	todaychartdata.addRows([
	[ new Date(e['time'] * 1000), e['probability'] * 100, e['temp'], e['relHumidity'] * 100, e['type'] ]
	] );
	}

	var todayoptions = defaultoptions;
	todayoptions['title'] = 'Today';
	todayoptions['vAxis']['viewWindowMode'] = 'pretty';
	todayoptions['focusTarget'] = 'category';

	var todaychart = new google.visualization.AreaChart( document.getElementById('today_div'));
	todaychart.draw( todaychartdata, todayoptions );
	} );
	}

	</script>
	</head>
	<body>
	<div id="weather_summary"></div>
	<div id="nexthour_div"></div>
	<div id="today_div"></div>

	</body>
	</html>