Asp. NET Paint all introduction (ON)

This code is based on BETA2 development

More and more Web applications need to use charts for data display and analysis. For example: The poll results show that the company's production statistics chart shows the analysis and so on. The use of graphs to display data, with intuitive, clear and other advantages.

Traditional ASP technology does not support the drawing of graphs, then you have to use Active X or Java applets to achieve this function. The recent asp.net solves this problem by drawing rich, dynamic graphs using ASP.net's class on graphic display. This article will describe how to use asp.net technology to draw bars and pie charts with Ado.net technology.

First, create a C # class library.

Open Vs.net and set up a insight_cs named. Webcharts the new Class library project, change the name of the solution to insight, and change the Class.cs file name to Insight_cs. WebCharts.cs, finally open Insight_cs. WebCharts.cs files. Where the code is as follows:

/* Custom class, by entering different parameters, these classes can draw different graphics.

Using System; Using system.io;//is used for file access using system.data;//for data access using system.drawing;//to provide basic functionality for drawing GDI + graphics using system.drawing.text;/
/provides advanced functionality for drawing GDI + graphics using system.drawing.drawing2d;//provides advanced two-dimensional, vector graphics feature using system.drawing.imaging;//provides advanced features for drawing GDI + graphics Namespace Insight_cs.  Webcharts {public class Piechart {public Piechart () {} public void Render (string title, string subtitle, int width, int
Height, DataSet chartData, Stream target) {const int side_length = n; const int pie_diameter = 200;
DataTable dt = chartdata.tables[0];
By inputting the parameters, the total radix of the pie chart is obtained by float sumdata = 0; foreach (DataRow dr in Dt.
Rows) {Sumdata + = Convert.tosingle (dr[1]);}//Generate an Image object, resulting in a Graphics object Bitmap BM = new Bitmap (width,height);
Graphics g = graphics.fromimage (BM);
Sets the properties of Object G G.scaletransform ((Convert.tosingle (width))/side_length, (convert.tosingle (height))/side_length);
G.smoothingmode = Smoothingmode.default;
G.textrenderinghint = Textrenderinghint.antialias;
Canvas and Edge setting g.clear (Color.White); G.drawrectangle (pens.black,0, 0,side_length-1,side_length-1);
Gao title g.drawstring (title,new Font ("Tahoma"), Brushes.black,new PointF (5,5));
The legend of the Gao graph g.drawstring (subtitle,new Font ("Tahoma"), Brushes.black,new PointF (7,35));
Gao Figure Float Curangle = 0;
float Totalangle = 0; for (int i=0;i<dt. rows.count;i++) {curangle = convert.tosingle (dt.
ROWS[I][1])/sumdata * 360;
G.fillpie (New SolidBrush (Chartutil.getchartitemcolor (i)), 100,65,pie_diameter,pie_diameter,totalangle,curangle);
G.drawpie (Pens.black,100,65,pie_diameter,pie_diameter,totalangle,curangle);
Totalangle + = Curangle;
}//Paint case box and its text g.drawrectangle (pens.black,200,300,199,99);
g.DrawString ("Legend", New Font ("Tahoma", 12,fontstyle.bold), Brushes.black,new PointF (200,300));
Examples of various PointF boxorigin = new PointF (210,330);
PointF textorigin = new PointF (235,326);
float percent = 0; for (int i=0;i<dt. rows.count;i++) {G.fillrectangle (New SolidBrush (Chartutil.getchartitemcolor (i)), boxorigin.x,boxorigin.y,20,10); . DrawRectangle (Pens.black,boxorigin.x,boxorigin.y,20,10); Percent = convert.tosingle (dt.
ROWS[I][1])/sumdata * 100; g.drawstring (dt. Rows[i][0]. ToString () + "-" + dt. ROWS[I][1]. ToString () + "(" + percent.)
ToString ("0") + "%", new Font ("Tahoma", "Brushes.black,textorigin");
BOXORIGIN.Y + 15;
TEXTORIGIN.Y + 15; ///through Response.outputstream, the content of the graphic is sent to the browser bm.
Save (target, imageformat.gif); Recycling Resources BM.
Dispose ();
G.dispose (); Draw bar Chart public class Barchart {public Barchart () {} public void Render (string title, string subtitle, int width, int Height, DataSet chartData, Stream target) {Const INT side_length = + Const INT chart_top = + Const int Chart_height
= 200;
const int chart_left = 50;
const int chart_width = 300;
DataTable dt = chartdata.tables[0];
Compute the highest point float Highpoint = 0; foreach (DataRow dr in Dt.  Rows) {if (Highpoint<convert.tosingle (dr[1])) {Highpoint = Convert.tosingle (dr[1)),}//Create a Graphics object instance Bitmap BM =
New Bitmap (width,height);
Graphics g = graphics.fromimage (BM); Set bar graph and Text properties G.scaletransform (Convert.
ToSingle (width))/side_length, (convert.tosingle (height))/side_length);
G.smoothingmode = Smoothingmode.default;
G.textrenderinghint = Textrenderinghint.antialias;
Set Canvas and Edge g.clear (Color.White);
G.drawrectangle (pens.black,0,0,side_length-1,side_length-1);
Draw the headline g.drawstring (Title,new Font ("Tahoma"), Brushes.black,new PointF (5,5));
Draw a small title g.drawstring (subtitle,new Font ("Tahoma"), Brushes.black,new PointF (7,35)); Draw a bar chart float barwidth = chart_width/(dt.
Rows.Count * 2);
PointF barorigin = new PointF (Chart_left + (BARWIDTH/2), 0); float barheight = dt.
Rows.Count; for (int i=0;i<dt. rows.count;i++) {barheight = convert.tosingle (dt.
ROWS[I][1]) * 200/HIGHPOINT;
BARORIGIN.Y = Chart_top + chart_height-barheight;
G.fillrectangle (New SolidBrush (Chartutil.getchartitemcolor (i)), barorigin.x,barorigin.y,barwidth,barheight);
barorigin.x = barorigin.x + (BarWidth * 2); //Set Edge G.drawline (New Pen (color.black,2), new Point (Chart_left,chart_top), new Point (Chart_left,chart_top + Chart_ HEIGHT));
G.drawline (New Pen (color.black,2), new Point (Chart_left,chart_top + chart_height), new Point (Chart_left + chart_width,
Chart_top + chart_height));
Paint example Boxes and text G.drawrectangle (new Pen (color.black,1), 200,300,199,99);
g.DrawString ("Legend", New Font ("Tahoma", 12,fontstyle.bold), Brushes.black,new PointF (200,300));
Drawing example PointF boxorigin = new PointF (210,330);
PointF textorigin = new PointF (235,326); for (int i=0;i<dt. rows.count;i++) {G.fillrectangle (New SolidBrush (Chartutil.getchartitemcolor (i)), boxorigin.x,boxorigin.y,20,10); .
DrawRectangle (pens.black,boxorigin.x,boxorigin.y,20,10); g.drawstring (dt. Rows[i][0]. ToString () + "-" + dt. ROWS[I][1].
ToString (), New Font ("Tahoma", "Brushes.black,textorigin");
BOXORIGIN.Y + 15;
TEXTORIGIN.Y + 15; ///output graphic BM.
Save (target, imageformat.gif); Resource Recycling BM.
Dispose ();
G.dispose (); The public class Chartutil {public Chartutil () {} public static color getchartitemcolor (int itemindex) {color Selectedc
Olor; Switch (itemindex) {Case 0:selectedcolor = Color.
Blue;
Break
Case 1:selectedcolor = color.red;
Break
Case 2:selectedcolor = Color.yellow;
Break
Case 3:selectedcolor = color.purple;
Break
Default:selectedcolor = Color.green;
Break
return selectedcolor; }
}
}