mhawksey/index.html

## index.html
<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>
      Google Visualization API Sample
    </title>
    <script type="text/javascript" src="//www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['linechart']});
    </script>
    <script type="text/javascript">
    var visualization;

    function drawVisualization() {
      // To see the data that this visualization uses, browse to
      // http://spreadsheets.google.com/ccc?key=pCQbetd-CptGXxxQIG7VFIQ
      var query = new google.visualization.Query(
          '//docs.google.com/spreadsheets/d/1cnle5u7v-TGFInsFj_pooFWvwbti0NCL1anegCrltXU/gviz/tq');

      // Apply query language.
      query.setQuery('SELECT A,D WHERE D > 100 ORDER BY D');

      // Send the query with a callback function.
      query.send(handleQueryResponse);
    }

    function handleQueryResponse(response) {
      if (response.isError()) {
        alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
        return;
      }

      var data = response.getDataTable();
      visualization = new google.visualization.LineChart(document.getElementById('visualization'));
      visualization.draw(data, {legend: 'bottom'});
    }


    google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <div id="visualization" style="height: 400px; width: 400px;"></div>
  </body>
</html>
	<!--
	You are free to copy and use this sample in accordance with the terms of the
	Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
	-->

	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
	<title>
	Google Visualization API Sample
	</title>
	<script type="text/javascript" src="//www.google.com/jsapi"></script>
	<script type="text/javascript">
	google.load('visualization', '1', {packages: ['linechart']});
	</script>
	<script type="text/javascript">
	var visualization;

	function drawVisualization() {
	// To see the data that this visualization uses, browse to
	// http://spreadsheets.google.com/ccc?key=pCQbetd-CptGXxxQIG7VFIQ
	var query = new google.visualization.Query(
	'//docs.google.com/spreadsheets/d/1cnle5u7v-TGFInsFj_pooFWvwbti0NCL1anegCrltXU/gviz/tq');

	// Apply query language.
	query.setQuery('SELECT A,D WHERE D > 100 ORDER BY D');

	// Send the query with a callback function.
	query.send(handleQueryResponse);
	}

	function handleQueryResponse(response) {
	if (response.isError()) {
	alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
	return;
	}

	var data = response.getDataTable();
	visualization = new google.visualization.LineChart(document.getElementById('visualization'));
	visualization.draw(data, {legend: 'bottom'});
	}


	google.setOnLoadCallback(drawVisualization);
	</script>
	</head>
	<body style="font-family: Arial;border: 0 none;">
	<div id="visualization" style="height: 400px; width: 400px;"></div>
	</body>
	</html>