Integrate Google Graph with .Net

I was working in a dashboard section in my current project and everybody knows that dashboard mean graphs. Surfing on the net I could find a lot of options free and paid. Unfortunately the client decided for a paid one. Anyway I was taking a good look at Google Graph API which is sweet! Then I built my own solution to populate the graph based in my database information.

Check out the Google Graph

Based on this sample I created my own solution, basically before building the graph I'm using the jQuery.ajax() function to perform an ajax request in an ASPX page which will return the data to populate the graph.

This is the code behind from my page which will provide the data.
public partial class chart : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//Postback
string strReturn = "&Description=string,Year|number,Sales|number,Expenses";
strReturn += "&Data=2004,1000,400|2005,1170,460|2006,860,580|2007,1030,540";
Response.Write(strReturn.Trim());
}
}

As you can see I hardcoded the return value. Anyway you can get the idea about how to build your own return value.

So based in the sample provided by Google I just added few code in the script tag.
ascript type="text/javascript">
var myDataDescription = new Array();
var myData = new Array();

$.ajax({ url: 'chart.aspx', type: 'post', data: 'Type=1',
dataType: "text/html",
success: function (data) {
var desc = data.split('&Description=');
var ind = desc[1].indexOf('&');
var indFinal = (desc[1].length - (ind + 6));
var mydata = desc[1].substr(ind + 6, indFinal);
desc = desc[1].substr(0, ind - 1);
desc = desc.split('|');
mydata = mydata.split('|');

//Generate description array
for (var i = 0; i < desc.length; i++) {
var descInfo = desc[i].split(',');

myDataDescription[i] = new Array();
myDataDescription[i][0] = descInfo[0];
myDataDescription[i][1] = descInfo[1];
}

//Generate data array
for (var i = 0; i < mydata.length; i++) {
var descData = mydata[i].split(',');

myData[i] = new Array(3);
myData[i][0] = descData[0];
myData[i][1] = descData[1];
myData[i][2] = descData[2];
}

},
error: function (err) { alert('failed: ' + err); }
});

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

for (var i = 0; i < myDataDescription.length; i++) {
var columnType = myDataDescription[i][0];
var columnName = myDataDescription[i][1];
data.addColumn(columnType, columnName);
}

data.addRows(myData.length);

for (var i = 0; i < myData.length; i++) {
var columnA = myData[i][0];
var columnB = Number(myData[i][1]);
var columnC = Number(myData[i][2]);

data.setValue(i, 0, columnA);
data.setValue(i, 1, columnB);
data.setValue(i, 2, columnC);
}

var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, { width: 400, height: 240, title: 'Company Performance' });

}


Here you can download the source code.