victorabraham
8/11/2015 - 5:37 AM

Visualforce page to show google chart

Visualforce page to show google chart

<apex:page showheader="false" sidebar="false" controller="myAttendanceController">
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<apex:include pageName="header"/>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Status', 'Count'],
          ['Attended',  {!attendedCount}],
          ['Partially Attended', {!partialCount}],
          ['Absent',  {!absentCount}],
        ]);

        var options = {
          title: 'My Attendance',
          pieHole: 0.4,
        };

        var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
        chart.draw(data, options);
      }
    </script>
    <div class="container">
        <div id="donutchart" style="width: 900px; height: 500px;"></div>
    </div>
</apex:page>