|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Announcements
Chapters
Services
Feature Zones
|
Note: This is an unedited contribution. If this article is inappropriate,
needs attention or copies someone else's work without reference then please
Report This Article
Introduction
http://chart.apis.google.com/chart?cht=p3&chd=s:hW&chs=250x100&chl=Hello|World
* Bar Chart * Pie Chart * Venn diagram * Scatter Plot
<img src="http://chart.apis.google.com/chart?cht=p3&chd=s:asR&chs=400x150&chl=A|B|C" />
Graph Title
Graph Style
Graph Colors
Passing the Data
public string GenerateGraph() { //Get the Data to draw the graph DataTable dt = new DataTable(); dt = dtGraphData; //Get the max vals in the Data int maxval = GetMaxVal(dt); //SAMPLE: http://chart.apis.google.com/chart?cht=p3&chs=400x200&chd=s:asR&chl=A|B|C string GReqURL = "http://chart.apis.google.com/chart?chts="+GTitleColor+","+GTitleSize+"&chtt="+GTitle+"&chco="+GColors+"&cht=p3&chs="+GWidth+"x"+GHeight; //chts for Title Style : color,size //chtt for title text //chco for colors: one or many string simpleEncoding = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; string chartData = string.Empty; string chartLabels = string.Empty; StringBuilder strbchartData = new StringBuilder(); StringBuilder strbchartLabels = new StringBuilder(); strbchartData.Append("&chd=s:"); strbchartLabels.Append("&chl="); int strlen = simpleEncoding.Length - 1; foreach (DataRow dr in dt.Rows) { //Generate the chart DATA int arrVal = Convert.ToInt32(dr[2]); int len = strlen * arrVal / maxval; strbchartData.Append(simpleEncoding.Substring(len, 1)); //Generate the Chart Labels strbchartLabels.Append(dr[1] + "|"); } //Converting the string builder to string chartData = strbchartData.ToString(); chartLabels = strbchartLabels.ToString(); chartLabels = chartLabels.Substring(0, chartLabels.Length - 1); return GReqURL + chartData + chartLabels; } The code is written in C#. You can assign all the properties you want to assign and finally call the GenerateGraph method which returns the string. The below is the code sample. The entire is article is explained using the PIE graph example. The remaining graphs can also be achieved using the same way. DataTable dt = new DataTable(); //Get the Data the data table and pass it dt = GetGraphData(); PieGraph pg = new PieGraph(); pg.GraphColors = "5566AA"; pg.GraphHeight="125"; pg.GraphWidth="250"; pg.GraphTitle = "Welcome to Test Graph"; pg.GraphTitleColor = "112233"; pg.GraphTitleSize = "20"; pg.dtData = dt; GGReq = pg.GenerateGraph(); this.DataBind(); } DataTable GetGraphData() { SqlConnection con = new SqlConnection(connectionstring); SqlCommand cmd = new SqlCommand("Select * from GraphSupp", con); SqlDataAdapter da = new SqlDataAdapter(cmd); DataTable dt = new DataTable(); da.Fill(dt); return dt; }
Steps for generation of the graph1. Create a DataTable which contains column-2 as labels and column-3 as Data 2. Create and instance of PieGraph (refer the text doc i have attached) 3. Assign the properties 4. place the return string to the source of the image tag 5 Graph is generated Points of Interest
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||