Pie Chart Example

An example of a Google Pie Chart.

HTML

<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>

<input type='button' value='change' onclick='change()'>

JavaScript

google.setOnLoadCallback(drawChart);
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

var chart = new google.visualization.ColumnChart(document.getElementById('piechart'));
        var options = {
      width: 400,
      height: 240,
      animation:{
        'duration': 5000,
        'easing': 'out',
      },
      vAxis: {minValue:0, maxValue:100}
    };

function drawChart() {

        chart.draw(data, options);
      }

var ch=0;
    function change(){
        if(ch==0){
                  data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     1],
          ['Eat',      20],
          ['Commute',  20],
          ['Watch TV', 20],
          ['Sleep',    17]
        ]);
            ch=1;
        }
        else if(ch==1){
            data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     10],
          ['Eat',      2],
          ['Commute',  12],
          ['Watch TV', 24],
          ['Sleep',    47]
        ]);
            ch=0;
        }
        chart.draw(data, options);
    }