Team:TU-Delft/SynBioData

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
-
  <head>
+
<script>
-
    <meta charset="UTF-8">
+
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(
 +
      'https://docs.google.com/spreadsheet/pub?key=0ArsDNt8sj-LBdEdCREdxUTFmVXpPaTVnZm43d0RTdmc&single=true&gid=0&output=html');
-
    <title>Fusion Tables API Example: Google Chart Tools Data Table</title>
+
  // Apply query language.
 +
  query.setQuery('SELECT A  WHERE A =1 ORDER BY A');
-
    <link href="/apis/fusiontables/docs/samples/style/default.css"
+
  // Send the query with a callback function.
-
        rel="stylesheet" type="text/css">
+
  query.send(handleQueryResponse);
-
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
+
}
-
    <script type="text/javascript">
+
-
      google.load('visualization', '1', { packages: ['table'] });
+
-
      function drawTable() {
+
function handleQueryResponse(response) {
-
        var query = "SELECT 'Scoring Team' as Scoring, " +
+
  if (response.isError()) {
-
            "'Receiving Team' as Receiving, 'Minute of goal' as Minute " +
+
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
-
            'FROM 1VlPiBCkYt_Vio-JT3UwM-U__APurJvPb6ZEJPg';
+
    return;
-
        var team = document.getElementById('team').value;
+
  }
-
        if (team) {
+
-
          query += " WHERE 'Scoring Team' = '" + team + "'";
+
-
        }
+
-
        var queryText = encodeURIComponent(query);
+
-
        var gvizQuery = new google.visualization.Query('https://docs.google.com/spreadsheet/pub?key=0ArsDNt8sj-LBdEdCREdxUTFmVXpPaTVnZm43d0RTdmc&single=true&gid=0&output=html');
+
-
        gvizQuery.send(function(response) {
+
  var data = response.getDataTable();
-
          var table = new google.visualization.Table(
+
  visualization = new google.visualization.LineChart(document.getElementById('visualization'));
-
              document.getElementById('visualization'));
+
  visualization.draw(data, {legend: 'bottom'});
-
          table.draw(response.getDataTable(), {
+
</script>
-
            showRowNumber: true
+
-
          });
+
-
        });
+
-
      }
+
-
 
+
-
      google.setOnLoadCallback(drawTable);
+
-
    </script>
+
-
  </head>
+
-
  <body>
+
-
    <div>
+
-
      <label>Scoring Team:</label>
+
-
      <select id="team" onchange="drawTable();">
+
-
        <option value="">All</option>
+
-
        <option value="synthetic">synthetic</option>
+
-
        <option value="safety">safety</option>
+
-
        <option value="biosafety">biosafety</option>
+
-
      </select>
+
-
    </div>
+
-
    <div id="visualization"></div>
+
-
  </body>
+
</html>
</html>

Revision as of 12:06, 2 September 2013