折线图表
折线图表是程序中经常用到的一种图表技术,通过折线图表,可以很直观地反映出数据的变化。本节中通过几个实例向读者详细介绍折线图表的绘制技术。
实例297 折线图表分析人口出生率
实例说明
在进行人口统计时,经常需要对人口出生率进行统计分析,为了使统计的结果更加明了,可以将人口出生率以折线的形式展示给用户。运行本实例,在Default.aspx页面中选择要查看的年份后,即可在CountMontn.aspx页面中查看该年份的人口出生率折线图,如图13.10所示,其中红色折线即为人口出生率。
|
图13.10 折线图表分析人口出生率 |
技术要点
本实例主要通过using System.Drawing命名空间中Graphics类的DrawLines方法来实现。DrawLines方法用于绘制一系列连接一组Point结构的线段,其语法格式如下。
public void DrawLines(Pen pen,Point[] points)
|
参数说明: pen:它确定线段的颜色、宽度和样式。 points:结构数组,这些结构表示要连接的点。
注意:此方法用来绘制一系列连接一组终结点的线条。数组中的前两个点指定第一条线。每个附加点指定一个线段的终结点,该线段的起始点是前一条线段的结束点。
实现过程
(1)新建一个网站,将其命名为Ex13_10,默认主页为Default.aspx,添加新Web窗体,将其命名为CountMonth.aspx。
(2)后台代码中自定义了两个方法,它们分别用来计算各月份访问量总和以及将各月份所占百分比绘制出来,计算各月份访问量总和用到自定义方法SumYear(int Year),该方法的主要程序代码如下:
private int SumYear(int Year) { string cmdtxt2 = "SELECT SUM(Year_M1+Year_ M2+Year_M3+Year_M4+Year_M5+Year_M6+Year_M7+ Year_ M8+ Year_ M9+Year_M10+Year_M11+Year_M12) AS number FROM tb_07 WHERE ShowYear=" + Year + ""; SqlConnection Con = new SqlConnection (ConfigurationManager.AppSettings["ConSql"]); Con.Open( ); SqlDataAdapter dap = new SqlDataAdapter(cmdtxt2, Con); DataSet ds = new DataSet( ); dap.Fill(ds); return Convert.ToInt32(ds.Tables[0].Rows[0][0].ToString( )); } | 由于本实例中的CreateImage(int Year)方法代码较多,下面进行分段讲解。画图之前,必须先建立一个Bitmap对象和一个Graphics对象,以便能够完成图形绘制。创建Bitmap对象和Graphics对象的主要代码如下:
//定义画布大小 int height = 440, width = 600; System.Drawing.Bitmap image = new System.Drawing.Bitmap(width,height); //创建Graphics类对象 Graphics g = Graphics.FromImage(image); | 画图对象创建完成后,下面需要绘制线条,绘制线条代码如下:
//清空图片背景色 g.Clear(Color.White); Font font = new System.Drawing.Font("Arial", 9,FontStyle.Regular); Font font1 = new System.Drawing.Font("宋体", 20, FontStyle.Regular); Font font2 = new System.Drawing.Font("Arial", 8, FontStyle.Regular); System.Drawing.Drawing2D.LinearGradientBrush brush = new System.Drawing. Drawing2D.LinearGradientBrush (new Rectangle(0, 0, image.Width, image.Height), Color.Blue,Color.Blue, 1.2f, true); g.FillRectangle(Brushes.AliceBlue, 0, 0, width, height); Brush brush1 = new SolidBrush(Color.Blue); Brush brush2 = new SolidBrush(Color.SaddleBrown); g.DrawString(""+Year+"年各月份人口出生率", font1, brush1, new PointF(130, 30)); //画图片的边框线 g.DrawRectangle(new Pen(Color.Blue), 0,0, image.Width - 1, image.Height - 1); Pen mypen = new Pen(brush,1); Pen mypen2 = new Pen(Color.Red,2); //绘制线条 //绘制纵向线条 int x = 60; for (int i = 0; i < 12; i++) { g.DrawLine(mypen,x, 80, x, 340); x = x+40; } Pen mypen1 = new Pen(Color.Blue,2); g.DrawLine(mypen1, x-480, 80, x-480, 340); //绘制横向线条 int y = 106; for (int i = 0; i <9; i++) { g.DrawLine(mypen,60, y, 540, y); y = y + 26; } g.DrawLine(mypen1, 60, y, 540, y); |
线条绘制完成后,需要为绘制完的框架添加标记,本实例主要给对应的线条添加月份和百分比,主要程序代码如下:
//x轴上对应的标记 String[] n = {" 一月", " 二月", " 三月", " 四月", " 五月", " 六月", " 七月", " 八月", " 九月", " 十月", "十一月", "十二月"}; x = 35; for (int i = 0; i < 12; i++) { g.DrawString(n[i].ToString( ), font,Brushes.Red, x, 348); //设置文字内容及输出位置 x = x + 40; } //y轴上对应的标记 String[] m = {"45%", " 40%", " 35%", " 30%", " 25%", " 20%", " 15%", " 10%", " 5%"}; y = 100; for (int i = 0; i < 9; i++) { g.DrawString(m[i].ToString( ),font, Brushes.Red, 25, y); //设置文字内容及输出位置 y = y + 26; } | 基本框架绘制完成后,下面要将数据库中的数据检索出来并以一定的比例绘制到图像中,检索数据并绘制折线的代码如下:
int[] Count = new int[12]; string cmdtxt2 = "SELECT * FROM tb_07 WHERE ShowYear="+Year+""; SqlConnection Con = new SqlConnection (ConfigurationManager.AppSettings["ConSql"]); Con.Open( ); SqlCommand Com = new SqlCommand(cmdtxt2, Con); SqlDataAdapter da = new SqlDataAdapter( ); da.SelectCommand = Com; DataSet ds = new DataSet( ); da.Fill(ds); int j = 0; int number = SumYear(Year); for(j=0;j<12;j++) { Count[j] = Convert.ToInt32(ds.Tables[0].Rows[0][j+1]. ToString( )) * 50 / number; } double[] Percent = new double[12]; for (int i = 0; i < 12; i++) { Percent[i] = Convert.ToDouble(ds.Tables[0].Rows[0][i + 1]. ToString( )) * 50 / Convert.ToDouble(number); } x = 60; for (int i = 0; i < 12; i++) { if (Percent[i].ToString( ).Length >= 5) { //设置文字内容及输出位置 g.DrawString(Percent[i].ToString( ).Substring(0, 5) + "%", font2, brush2, x, 340 - Count[i] * 26 / 5); x = x + 40; } else { //设置文字内容及输出位置 g.DrawString("0%", font2, brush2, x, 340 - Count[i] * 26 / 5); x = x + 40; } } //显示折线效果 SolidBrush mybrush = new SolidBrush(Color.Red); Point[] points = new Point[12]; points[0].X = 60; points[0].Y = 340-Count[0] * 26 / 5; points[1].X =100; points[1].Y = 340 - Count[1] * 26 / 5; points[2].X = 140; points[2].Y = 340 - Count[2] * 26 / 5; points[3].X = 180; points[3].Y = 340 - Count[3] * 26 / 5; points[4].X = 220; points[4].Y = 340 - Count[4] * 26 / 5; points[5].X = 260; points[5].Y = 340 - Count[5] * 26 / 5; points[6].X = 300; points[6].Y = 340 - Count[6] * 26 / 5; points[7].X = 340; points[7].Y = 340 - Count[7] * 26 / 5; points[8].X = 380; points[8].Y = 340 - Count[8] * 26 / 5; points[9].X = 420; points[9].Y = 340 - Count[9] * 26 / 5; points[10].X = 460; points[10].Y = 340 - Count[10] * 26 / 5; points[11].X = 500; points[11].Y = 340 - Count[11] * 26 / 5; g.DrawLines(mypen2, points); | 以上操作完成了图形的绘制,最后将图像显示到页面中。将图像显示到页面中的主要程序代码如下:
System.IO.MemoryStream ms = new System.IO.MemoryStream( ); image.Save(ms, System.Drawing.Imaging.ImageFormat.Gif); Response.ClearContent( ); Response.ContentType = "image/Gif"; Response.BinaryWrite(ms.ToArray( ));
|
举一反三
根据本实例,读者可以:
开发股票统计分析模块;
开发家电价格分析模块;
开发石油产品市场行情模块。
|