#眉標=AJAX #副標=AJAX網頁開發利器（4） #大標=實作互動式網頁 #作者=文／圖王寧疆 ==程式1 ===========

================ ==程式2 =========== ================ ==程式3 =========== protected void Page_Load(object sender, EventArgs e) { ArrayList CategoriesName = new ArrayList(); //建立ArrayList類別的物件 ArrayList CategoriesSales = new ArrayList(); //建立ArrayList類別的物件 string strConn = "data source=.;initial catalog=Northwind;Integrated Security=true;"; //準備資料庫連線資訊 string strCmd = "SELECT * FROM [Category Sales for 1997]"; //查詢銷售統計資料的SQL敘述 SqlConnection conn = new SqlConnection(strConn); //建立SqlConnection類別的物件 SqlCommand cmd = new SqlCommand(strCmd, conn); //建立SqlCommand類別的物件 conn.Open(); //開啟資料庫連線 SqlDataReader dr=cmd.ExecuteReader();//執行查詢並建立取用查詢結果的SqlDataReader類別的物件 while (dr.Read()) //讀取查詢得到的記錄 { CategoriesName.Add(dr.GetSqlString(0)); //將記錄第一個欄位的內容填入CategoriesName集合 CategoriesSales.Add(dr.GetSqlMoney(1)); //將記錄第一個欄位的內容填入CategoriesSales集合 } cmd.Dispose(); //丟棄SqlCommand類別的物件 conn.Close(); //關閉資料庫連線 conn.Dispose(); //丟棄SqlConnection類別的物件 DrawBarGraph("Category Sales for 1997", CategoriesName, CategoriesSales, Response.OutputStream); //利用存放在集合中的銷售統計資料繪製統計圖表 } ================ ==程式4 =========== void DrawBarGraph(string strTitle, ArrayList aX, ArrayList aY, Stream Target) { Color [] ca={Color.Red, Color.Blue, Color.Gainsboro, Color.RoyalBlue, Color.Teal, Color.YellowGreen, Color.Gold, Color.Green}; //準備繪製長條圖的色彩 const int iColWidth = 100, iColSpace = 25, iMaxHeight = 400, iHeightSpace = 25, iXLegendSpace = 40, iTitleSpace = 50; //準備長條圖的寬度，高度，間隔，標題和圖例的空間 int iMaxWidth = (iColWidth + iColSpace) * aX.Count + iColSpace, iMaxColHeight = 0, iTotalHeight = iMaxHeight + iXLegendSpace + iTitleSpace; //計算統計圖表的最大寬度　　Bitmap objBitmap = new Bitmap(iMaxWidth, iTotalHeight); //建立Bitmap類別的物件　　Graphics objGraphics=Graphics.FromImage(objBitmap);//從Bitmap類別的物件取得Graphics類別的物件　　objGraphics.FillRectangle(new SolidBrush(Color.White), 0, 0, iMaxWidth, iTotalHeight); //繪製背景　　objGraphics.FillRectangle(new SolidBrush(Color.Ivory), 0, 0, iMaxWidth, iMaxHeight); //繪製背景　　for (int i=0;i iMaxColHeight) iMaxColHeight = y; 　　} 　　int iBarX = iColSpace, iCurrentHeight; //準備繪製長條圖需要的變數　　SolidBrush objBrush = null; //準備畫刷變數　　Font fontLegend = new Font("Arial", 11), fontValues = new Font("Arial", 8), fontTitle = new Font("Arial", 24); //準備繪製長條圖需要的字型　　for (int iLoop = 0; iLoop< aX.Count;iLoop++) //繪製長條圖　　{ objBrush = new SolidBrush(ca[iLoop]); //利用不同的色彩建立畫刷 iCurrentHeight = (int)(double.Parse(aY[iLoop].ToString()) / (double)iMaxColHeight * (double)iMaxHeight - iHeightSpace); //計算長條圖的高度 objGraphics.FillRectangle(objBrush, iBarX, iMaxHeight - iCurrentHeight, iColWidth, iCurrentHeight); objGraphics.DrawString(aX[iLoop].ToString(), fontLegend, objBrush, iBarX, iMaxHeight); objGraphics.DrawString(String.Format("{0:#,###}", aY[iLoop]), fontValues, objBrush, iBarX, iMaxHeight - iCurrentHeight - 15); //繪出長條圖 iBarX += (iColSpace + iColWidth); //計算下一個繪製位置　　} objGraphics.DrawString(strTitle, fontTitle, objBrush, (iMaxWidth / 2) - strTitle.Length * 6, iMaxHeight + iXLegendSpace); //繪出長條圖的標題文字　　objBitmap.Save(Target, ImageFormat.Gif); //將繪製好的內容輸出成格式為GIF的圖形資料　　objGraphics.Dispose(); //丟棄Graphics類別的物件　　objBitmap.Dispose(); //丟棄Bitmap類別的物件 } ================ ==程式5 =========== ================ ==程式6 =========== 紅色: ================ ==程式7 =========== ================ ==程式8 =========== 利用Slider控制項改變文字的色彩

================ ==程式9 =========== protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) //判斷網頁是否是第一次執行 { //宣告網頁上ID屬性內容值為RedSlider的控制項有能力以非同步的方式引發PostBack ScriptManager1.RegisterAsyncPostBackControl(RedSlider); //宣告網頁上ID屬性內容值為GreenSlider的控制項有能力以非同步的方式引發PostBack ScriptManager1.RegisterAsyncPostBackControl(GreenSlider); //宣告網頁上ID屬性內容值為BlueSlider的控制項有能力以非同步的方式引發PostBack ScriptManager1.RegisterAsyncPostBackControl(BlueSlider); } else { int r = int.Parse(RedSliderData.Text); //取出使用者輸入的紅色成份資料 int g = int.Parse(GreenSliderData.Text); //取出使用者輸入的綠色成份資料 int b = int.Parse(BlueSliderData.Text); //取出使用者輸入的藍色成份資料 ColorText.ForeColor = Color.FromArgb(r, g, b); //依據所取出的顏色成份更新網頁顯示的文字顏色 } } ================