Create a Dynamic Column Chart in SharePoint using JQuery & Google Chart API

1. On the list, create new a standard view. Select the columns to you want your chart.

2. Click 'Site Actions' -> Select 'Edit Page' -> Click 'Add a Web Part' -> Check 'Content Editor Web Part' from Miscellaneous section and Press 'Add' button to insert the webpart.

3.Click edit -> select 'Modify Shared Web Part' -> Press 'Source Editor' button.

4.Apply the below code, that's it.

<script type="text/javascript">
if(typeof jQuery=="undefined"){
var jQPath="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/";
document.write("<script src='",jQPath,"jquery.js' type='text/javascript'><\/script>");
}
</script>

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">

var FChartValue = new Array();
var FChartName = new Array();


$("document").ready(function()
{
  var arrayList=$("td.ms-vb-title:contains('')");
  var Coords= new Array();
  var Labels= new Array();
  $.each(arrayList, function(i,e)
  {
    Labels[i]=$(e).text();
  });

  var arrayList1=$("td.ms-vb2:contains('')");
  $.each(arrayList1, function(i,e)
  {
    Coords[i]=$(e).text();
  });

  FChartValue = Coords;
  FChartName = Labels;
});

//Graph Rendering
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart()
{
  var data = new google.visualization.DataTable();

  data.addColumn('string', 'Service');
  data.addColumn('number', 'Quanity');

  data.addRows(FChartValue.length);

  for (i=0; i<FChartValue.length; i++)
  {
    data.setValue(i, 0, FChartName[i]);
    data.setValue(i, 1, parseInt(FChartValue[i]));
  }

  var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
  chart.draw(data, {title: 'Total Count of Maintenance',
    width: 600, height: 350, is3D: false,
    hAxis: {title: "Service Request by Priority"},
    vAxis: {title: "Quanity of Service Requests"}}
  );
}
</script>
<div id="chart_div" align="center"></div>

5.If you want, you can hide the standard list view, so the page show only chart without list view.

6.Click 'edit' from list view web part -> select 'Layout' -> checked 'Hidden' -> Press 'Ok' button to hide list view.