Load data in google pie chart - Javascript Google Chart

Javascript examples for Google Chart:Pie Chart

  1. HOME
  2. Javascript
  3. Google Chart
  4. Pie Chart

Description

Load data in google pie chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Pie Chart Example</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
   </head> 
   <body> 
      <script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['corechart']}]}"></script>  
      <div id="piechart" style="width: 900px; height: 500px;"></div> 
      <select id="SampleVAL" value="none"> 
         <option value="ergo01">sample1</option> 
         <option value="ergo02">sample2</option> 
         <option value="ergo03">sample3</option> 
      </select> 
      <button onclick="drawChart()">Try it</button>  
      <script type="text/javascript">
google.setOnLoadCallback(drawChart);/*from www . j  a v a2 s  . c o  m*/
function drawChart() {
    var Samplevalue =document.getElementById("SampleVAL").value;
  if(Samplevalue=="ergo01")
  {
      console.log(Samplevalue)
    var data = google.visualization.arrayToDataTable([
    ['Soort', 'Aantal'],
    ['Escherichia', 12.10],
    [' Ruminococcus', 6.44],
    ['Christensenellaceae', 6.15],
    ['Oscillospira', 13.20],
    ['Faecalibacterium', 15.50],
    ['Bacteroides', 3.07],
    ['Coprococcus', 1.02],
    ['Bacteroides', 1.00],
    ['Akkermansia', 0.81],
    ['Comamonas', 0.69]
                                                    ]);
  }
else if(Samplevalue=="ergo02")
  {
      console.log(Samplevalue)
    var data = google.visualization.arrayToDataTable([
    ['Soort', 'Aantal'],
    ['Escherichia', 25.10],
    [' Ruminococcus', 60.44],
    ['Christensenellaceae', 66.15],
    ['Oscillospira', 103.20],
    ['Faecalibacterium', 15.50],
    ['Bacteroides', 3.07],
    ['Coprococcus', 1.02],
    ['Bacteroides', 1.00],
    ['Akkermansia', 0.81],
    ['Comamonas', 0.69]
                                                  ]);
  }
else {
    console.log(Samplevalue)
  var data = google.visualization.arrayToDataTable([
  ['Soort', 'Aantal'],
  ['Escherichia', 25.10],
  [' Ruminococcus', 60.44],
  ['Christensenellaceae', 66.15],
  ['Oscillospira', 103.20],
  ['Faecalibacterium', 15.50],
  ['Bacteroides', 3.07],
  ['Coprococcus', 1.02],
  ['Bacteroides', 1.00],
  ['Akkermansia', 0.81],
  ['Comamonas', 0.69]]);
    }
var options = {
title: 'My Daily Activities',
};
var chart = new google.visualization.PieChart(document.getElementById('piechart'));
chart.draw(data, options);
}

      </script>  
   </body>
</html>

Related Tutorials