Donut chart example

An example of a Google Donut Chart.

by Sinh Nguyen

HTML

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<div id="donutchart" style="width: 900px; height: 500px;"></div>

JavaScript

google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7],
           ['T1ask', 'Hours per Day'],
          ['W1ork',     11],
          ['E1at',      2],
          ['Co1mmute',  2],
          ['Wa1tch TV', 2],
          ['Sl1eep',    7],
           ['Ta2sk', 'Hours per Day'],
          ['Wo3rk',     11],
          ['Ea4t',      2],
          ['Co5mmute',  2],
          ['Wa5tch TV', 2],
          ['Sl6eep',    7],
        ]);

        var options = {
          title: 'My Daily Activities',
          pieHole: 0.4,
            chartArea:{left: '100'},
         pieSliceText: 'label',
            pieStartAngle: 0,
            pieSliceTextStyle:{color: 'white', fontName: 'arial', fontSize: 10}
        };

        var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
        chart.draw(data, options);
      }