Team:Virginia/Tabs

From 2014.igem.org

(Difference between revisions)
 
(One intermediate revision not shown)
Line 1: Line 1:
 +
{{Template:Team:Virginia:Test}}
<html>
<html>
-
  <head>
+
<head>
-
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
+
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
-
    <script type="text/javascript">
+
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 +
  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
 +
  <link rel="stylesheet" href="/resources/demos/style.css">
 +
  <script src="https://www.google.com/jsapi"></script>
 +
 +
 
 +
<script type="text/javascript">
       google.load("visualization", "1", {packages:["geochart"]});
       google.load("visualization", "1", {packages:["geochart"]});
       google.setOnLoadCallback(drawRegionsMap);
       google.setOnLoadCallback(drawRegionsMap);
Line 8: Line 15:
       function drawRegionsMap() {
       function drawRegionsMap() {
-
        var data = google.visualization.arrayToDataTable([
+
 
-
['Region Code', 'Sub-Continent','Popularity'],
+
          var data = google.visualization.arrayToDataTable([
 +
              ['Region Code', 'Sub-Continent', 'Popularity'],
['154' ,'Northern European', 30.5],
['154' ,'Northern European', 30.5],
['143' ,'Central Asia', 52],
['143' ,'Central Asia', 52],
Line 28: Line 36:
['145' ,'Western Asia', 100],
['145' ,'Western Asia', 100],
['018' ,'', 0],
['018' ,'', 0],
-
        ]);
+
          ]);
 +
 
 +
          var data2 = google.visualization.arrayToDataTable([
 +
              ['Region Code', 'Sub-Continent', 'Popularity'],
 +
['154' ,'Northern European', 80.5],
 +
['143' ,'Central Asia',76],
 +
['021' ,'North American', 90.3],
 +
['039' ,'Southern Europe', 93.8],
 +
['030' ,'Eastern Asia', 83.3],
 +
['155' ,'Western Europe', 82.7],
 +
['151' ,'Eastern Europe',80],
 +
['034' ,'Southern Asia',100],
 +
['035' ,'South-Eastern Asia', 100],
 +
['029' ,'Carribean/Central America/South America', 68.8],
 +
['013' ,'Carribean/Central America/South America', 68.8],
 +
['005' ,'Carribean/Central America/South America', 68.8],
 +
['053' ,'Oceania', 100],
 +
['054' ,'Oceania', 100],
 +
['057' ,'Oceania', 100],
 +
['061' ,'Oceania', 100],
 +
['145' ,'Western Asia', 100],
-
        var options = {};
+
          ]);
 +
 
 +
 
 +
          var options = {
 +
              resolution: 'subcontinents',
 +
legend: 'none',
 +
sizeAxis: { minValue: 0, maxValue: 100 },
 +
              colorAxis: {colors: ['white', 'purple']},
 +
backgroundColor: '#EEF8FC'
 +
        ,width:900
 +
          ,height:500
 +
 
 +
          };
 +
 
 +
          var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
 +
  var chart2 = new google.visualization.GeoChart(document.getElementById('regions_div2'));
 +
          chart.draw(data, options);
 +
chart2.draw(data2, options);
-
        var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
 
-
        chart.draw(data, options);
 
       }
       }
     </script>
     </script>
-
   </head>
+
 
-
  <body>
+
 
-
    <div id="regions_div" style="width: 900px; height: 500px;"></div>
+
 
-
  </body>
+
<script>
 +
   $(function() {
 +
 
 +
    $( "#tabs" ).tabs();
 +
  });
 +
  </script>
 +
 
 +
<style>
 +
#regions_div{
 +
margin: 0 auto;
 +
}
 +
</style>
 +
 
 +
 
 +
</head>
 +
<body>
 +
 +
<div id="regions_div"></div>
 +
 
 +
</body>
</html>
</html>

Latest revision as of 00:43, 18 October 2014