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