推薦：ASP.NET的實(shí)時(shí)天氣及24小時(shí)天氣預(yù)報(bào)
修改其中的url獲得其他城市的天氣情況 如廣州為： http://weather.yahoo.com/forecast/CHXX0037_c.html 注意僅適用于獲得yahoo上的天氣預(yù)報(bào)

本文代碼是基于Beta2開(kāi)發(fā)

越來(lái)越多的Web應(yīng)用需要使用圖表來(lái)進(jìn)行數(shù)據(jù)顯示和分析。例如：投票結(jié)果顯示，公司生產(chǎn)情況統(tǒng)計(jì)圖顯示分析等等。利用圖表來(lái)顯示數(shù)據(jù)，具有直觀，清晰等優(yōu)點(diǎn)。

傳統(tǒng)的ASP技術(shù)是不支持畫(huà)圖表的，那么就不得不利用Active X或者Java applets來(lái)實(shí)現(xiàn)這個(gè)功能。新近出現(xiàn)的ASP.NET解決了這個(gè)問(wèn)題，只要利用ASP.NET中關(guān)于圖形顯示的類，就可以畫(huà)出豐富，動(dòng)態(tài)的圖表(如圖1)。本文將要講述如何利用ASP.NET技術(shù)結(jié)合ADO.NET技術(shù)畫(huà)條形圖和餅圖。

首先建立一個(gè)c#的類庫(kù)。

打開(kāi)vs.net，建立一個(gè)名為Insight_cs.WebCharts新的類庫(kù)工程，將解決方案的名稱改為Insight，將Class.cs文件名改為Insight_cs.WebCharts.cs，最后打開(kāi)Insight_cs.WebCharts.cs文件。其中代碼如下：

以下為引用的內(nèi)容： /*自定義類，通過(guò)輸入不同的參數(shù)，這些類可以畫(huà)不同的圖形 */ using System; using System.IO;//用于文件存取 using System.Data;//用于數(shù)據(jù)訪問(wèn) using System.Drawing;//提供畫(huà)GDI 圖形的基本功能 using System.Drawing.Text;//提供畫(huà)GDI 圖形的高級(jí)功能 using System.Drawing.Drawing2D;//提供畫(huà)高級(jí)二維，矢量圖形功能 using System.Drawing.Imaging;//提供畫(huà)GDI 圖形的高級(jí)功能 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 = 400; const int PIE_DIAMETER = 200; DataTable dt = chartData.Tables[0]; file://通過(guò)輸入?yún)��?shù)，取得餅圖中的總基數(shù) float sumData = 0; foreach(DataRow dr in dt.Rows) { sumData = Convert.ToSingle(dr[1]); } file://產(chǎn)生一個(gè)image對(duì)象，并由此產(chǎn)生一個(gè)Graphics對(duì)象 Bitmap bm = new Bitmap(width,height); Graphics g = Graphics.FromImage(bm); file://設(shè)置對(duì)象g的屬性 g.ScaleTransform((Convert.ToSingle(width))/SIDE_LENGTH,(Convert.ToSingle(height))/SIDE_LENGTH); g.SmoothingMode = SmoothingMode.Default; g.TextRenderingHint = TextRenderingHint.AntiAlias; file://畫(huà)布和邊的設(shè)定 g.Clear(Color.White); g.DrawRectangle(Pens.Black,0,0,SIDE_LENGTH-1,SIDE_LENGTH-1); file://畫(huà)餅圖標(biāo)題 g.DrawString(title,new Font("Tahoma",24),Brushes.Black,new PointF(5,5)); file://畫(huà)餅圖的圖例 g.DrawString(subTitle,new Font("Tahoma",14),Brushes.Black,new PointF(7,35)); file://畫(huà)餅圖 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; } file://畫(huà)圖例框及其文字 g.DrawRectangle(Pens.Black,200,300,199,99); g.DrawString("Legend",new Font("Tahoma",12,FontStyle.Bold),Brushes.Black,new PointF(200,300)); file://畫(huà)圖例各項(xiàng) 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); g.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",10),Brushes.Black,textOrigin); boxOrigin.Y = 15; textOrigin.Y = 15; } file://通過(guò)Response.OutputStream，將圖形的內(nèi)容發(fā)送到瀏覽器 bm.Save(target, ImageFormat.Gif); file://回收資源 bm.Dispose(); g.Dispose(); } } file://畫(huà)條形圖 public class BarChart { public BarChart() { } public void Render(string title, string subTitle, int width, int height, DataSet chartData, Stream target) { const int SIDE_LENGTH = 400; const int CHART_TOP = 75; const int CHART_HEIGHT = 200; const int CHART_LEFT = 50; const int CHART_WIDTH = 300; DataTable dt = chartData.Tables[0]; file://計(jì)算最高的點(diǎn) float highPoint = 0; foreach(DataRow dr in dt.Rows) { if(highPoint<Convert.ToSingle(dr[1])) { highPoint = Convert.ToSingle(dr[1]); } } file://建立一個(gè)Graphics對(duì)象實(shí)例 Bitmap bm = new Bitmap(width,height); Graphics g = Graphics.FromImage(bm); file://設(shè)置條圖圖形和文字屬性 g.ScaleTransform((Convert.ToSingle(width))/SIDE_LENGTH,(Convert.ToSingle(height))/SIDE_LENGTH); g.SmoothingMode = SmoothingMode.Default; g.TextRenderingHint = TextRenderingHint.AntiAlias; file://設(shè)定畫(huà)布和邊 g.Clear(Color.White); g.DrawRectangle(Pens.Black,0,0,SIDE_LENGTH-1,SIDE_LENGTH-1); file://畫(huà)大標(biāo)題 g.DrawString(title,new Font("Tahoma",24),Brushes.Black,new PointF(5,5)); file://畫(huà)小標(biāo)題 g.DrawString(subTitle,new Font("Tahoma",14),Brushes.Black,new PointF(7,35)); file://畫(huà)條形圖 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); } file://設(shè)置邊 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)); file://畫(huà)圖例框和文字 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)); file://畫(huà)圖例 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); g.DrawRectangle(Pens.Black,boxOrigin.X,boxOrigin.Y,20,10); g.DrawString(dt.Rows[i][0].ToString() " - " dt.Rows[i][1].ToString(),new Font("Tahoma",10),Brushes.Black,textOrigin); boxOrigin.Y = 15; textOrigin.Y = 15; } file://輸出圖形 bm.Save(target, ImageFormat.Gif); file://資源回收 bm.Dispose(); g.Dispose(); } } public class ChartUtil { public ChartUtil() { } public static Color GetChartItemColor(int itemIndex) { Color selectedColor; 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; } } }

代碼分析：

1、引入一些namespace

using System;

using System.IO;//用于文件存取

using System.Data;//用于數(shù)據(jù)訪問(wèn)

using System.Drawing;//提供畫(huà)GDI 圖形的基本功能

using System.Drawing.Text;//提供畫(huà)GDI 圖形的高級(jí)功能

using System.Drawing.Drawing2D;//提供畫(huà)高級(jí)二維，矢量圖形功能

using System.Drawing.Imaging;//提供畫(huà)GDI 圖形的高級(jí)功能

這些namespace將在后面被應(yīng)用。

2、自定義一個(gè)namespace為Insight_cs.WebCharts，其中包括了兩個(gè)類PieChart和BarChart，很清楚，class PieChart是為畫(huà)餅圖而建，class BarChart是為畫(huà)條形圖而建。由于class PieChart和class BarChar差不多，所以下面我們以餅圖為例，進(jìn)行代碼分析。

3、類PieChart建立一個(gè)方法Render，此方法可以含一些參數(shù)。簡(jiǎn)單說(shuō)明如下：

參數(shù)title，表示餅圖上方的大標(biāo)題文字。

參數(shù)subtitle，表示餅圖上方的小標(biāo)題文字。

參數(shù)width，height，表示了整個(gè)圖形的大小。

參數(shù)charData是一個(gè)DataSet對(duì)象實(shí)例，用于畫(huà)圖使用。

參數(shù)target是Stream對(duì)象的實(shí)例，用于圖形輸出時(shí)使用。

4、為了增加可讀性，定義一些常量：

const int SIDE_LENGTH = 400;//畫(huà)布邊長(zhǎng)

const int PIE_DIAMETER = 200;//餅圖直徑

5、定義一個(gè)DataTable，它是DataSet中的一個(gè)數(shù)據(jù)表。其中存放了餅圖的各個(gè)數(shù)據(jù)。

6、通過(guò)計(jì)算，得出餅圖中的總基數(shù)sumData。

7、建立了一個(gè)BitMap對(duì)象，它為要?jiǎng)?chuàng)建的圖形提供了內(nèi)存空間。并由此產(chǎn)生一個(gè)Graphics對(duì)象，它封裝了GDI 畫(huà)圖接口。

8、調(diào)用Graphics對(duì)象的方法ScaleTransform()，它是用來(lái)設(shè)定圖形比例的。

9、調(diào)用方法SmoothingMode()，TextRenderingHint()等來(lái)設(shè)置文字和圖形的相關(guān)屬性。

9、設(shè)置畫(huà)布和邊。

10、設(shè)置文字標(biāo)題，圖例，畫(huà)餅圖自身。

11、通過(guò)Stream，將圖形的內(nèi)容發(fā)送到瀏覽器。

12、最后回收資源。

至此畫(huà)餅圖的類就完成了。畫(huà)條形圖的方法和畫(huà)餅圖的方法大同小異，這里就不展開(kāi)講了。

總體看來(lái)，構(gòu)建畫(huà)圖的類沒(méi)有我們想象的那樣難，并沒(méi)有多么高深的算法。其實(shí)整體思路，就好像我們用筆在紙上畫(huà)圖是一摸一樣的。關(guān)鍵是各個(gè)方法的使用和參數(shù)設(shè)置。

分享：在ASP.NET中進(jìn)行文件處理(1)
一種程序設(shè)計(jì)語(yǔ)言，對(duì)文件處理的能力的大小往往也是一種語(yǔ)言功能大小的一種表現(xiàn)。在ASP.NET中，對(duì)于文件的處理主要是通過(guò).Net FrameWork SDK中的一個(gè)System.IO的名稱空間來(lái)實(shí)現(xiàn)了，在System.IO