"
Team:Imperial/Water Report
From 2014.igem.org
(Difference between revisions)
| Line 27: | Line 27: | ||
<section id="introduction"> | <section id="introduction"> | ||
<h2>Introduction</h2> | <h2>Introduction</h2> | ||
| + | <div id="water_use_breakdown" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div> | ||
</section> | </section> | ||
| Line 71: | Line 72: | ||
</div> | </div> | ||
</body> | </body> | ||
| + | <script type="text/javascript"> | ||
| + | $(function () { | ||
| + | $('#water_use_breakdown').highcharts({ | ||
| + | chart: { | ||
| + | plotBackgroundColor: null, | ||
| + | plotBorderWidth: 1, //null, | ||
| + | plotShadow: false | ||
| + | }, | ||
| + | title: { | ||
| + | text: 'Water Consumption by Sector' | ||
| + | }, | ||
| + | subtitle: { | ||
| + | text: 'Worldometers 2014' | ||
| + | }, | ||
| + | tooltip: { | ||
| + | pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' | ||
| + | }, | ||
| + | plotOptions: { | ||
| + | pie: { | ||
| + | allowPointSelect: true, | ||
| + | cursor: 'pointer', | ||
| + | dataLabels: { | ||
| + | enabled: true, | ||
| + | format: '<b>{point.name}</b>: {point.percentage:.1f} %', | ||
| + | style: { | ||
| + | color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black' | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | }, | ||
| + | series: [{ | ||
| + | type: 'pie', | ||
| + | name: 'Browser share', | ||
| + | data: [ | ||
| + | ['Agricultural irrigation', 67.0], | ||
| + | ['Industrial', 11.0], | ||
| + | |||
| + | { | ||
| + | name: 'Domestic Use', | ||
| + | y: 22.0, | ||
| + | sliced: true, | ||
| + | selected: true | ||
| + | }, | ||
| + | ] | ||
| + | }] | ||
| + | }); | ||
| + | }); | ||
| + | </script> | ||
</html> | </html> | ||
{{:Team:Imperial/Templates:footer}} | {{:Team:Imperial/Templates:footer}} | ||
Revision as of 00:28, 17 October 2014
