Team:Imperial/Resources/JS:charts

From 2014.igem.org

Revision as of 00:44, 17 October 2014 by HChughtai (Talk | contribs)
       $(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}: {point.percentage:.1f}%'
               },
               plotOptions: {
                   pie: {
                       allowPointSelect: true,
                       cursor: 'pointer',
                       dataLabels: {
                           enabled: true,
                           format: '{point.name}: {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
               },
                           ]
       }]
           });
       });

$(function () {

   $('#freshwater_per_capita').highcharts({
       chart: {
           type: 'column'
       },
       title: {
           text: 'Per capita freshwater resources'
       },
       subtitle: {
           text: 'World Bank 2009'
       },
       xAxis: {
           categories: ['Canada', 'Russia', 'Brazil', 'Australia', 'US','Sub-Saharan Africa','Japan','EU','UK','China','India','Middle East & North Africa'],
           title: {
               text: null
           }
       },
       yAxis: {
           min: 0,
           title: {
               text: 'Per capita freshwater resources(cubic metres)',
               align: 'high'
           },
           labels: {
               overflow: 'justify'
           }
       },
       
       plotOptions: {
           bar: {
               dataLabels: {
                   enabled: true
               }
           }
       },
       legend: {
           layout: 'vertical',
           align: 'right',
           verticalAlign: 'top',
           x: -40,
           y: 100,
           floating: true,
           borderWidth: 1,
           backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
           shadow: true
       },
       credits: {
           enabled: false
       },
       series: [{
           name: 'Per capita freshwater resources(cubic meters)',
           data: [84495,30393,29037,22413,9186,4708,3371,2929,2346,2113,1197,616]
       }]
   });

});

$(function () {

           $('#freshwater_breakdown').highcharts({
               chart: {
                   plotBackgroundColor: null,
                   plotBorderWidth: 1, //null,
                   plotShadow: false
               },
               title: {
                   text: 'Geographic breakdown of global freshwater resources'
               },
               subtitle: {
                   text: 'World Bank 2009'
               },
               tooltip: {
                   pointFormat: '{series.name}: {point.percentage:.1f}%'
               },
               plotOptions: {
                   pie: {
                       allowPointSelect: true,
                       cursor: 'pointer',
                       dataLabels: {
                           enabled: true,
                           format: '{point.name}: {point.percentage:.1f} %',
                           style: {
                               color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                           }
                       }
                   }
               },
               series: [{
                   type: 'pie',
                   name: 'Browser share',
                   data: [
               ['Brazil', 13.0],
               ['Russia', 10.0],
               ['Canada', 7.0],
               ['US', 7.0],
               ['China', 6.0],
               ['Colombia', 5.0],
               ['Indonesia', 5.0],
               ['Peru', 4.0],
               ['India', 3.0],
               ['Myanmar', 10.0],
                       {
                           name: 'Rest of World',
                           y: 38.0,
                           sliced: true,
                           selected: true
               },
                           ]
       }]
           });
       });