近日，在編寫一個統計程式的時候，希望通過條形圖、餅圖的形式形象地展現統計資料，為此，專門到sourceforge、codeproject等開源網站閱讀查詢有關資料，在這過程當中，閱讀了一份原始碼，感覺很多東西都可以借鑑，只不過，其最多隻支援10個條形圖的顯示，因為畫布僅有200*200，每個條形圖佔了10，間距又佔了10。對於這一點，筆者感覺不甚滿意，於是決定在參考借鑑原有程式碼的基礎上，做一個更加通用的繪圖程式。當然，因時間有限，筆者只做了針對條形圖、餅圖的實現。至於其他圖形，有興趣的朋友不妨自己實現。本篇文章將介紹條形圖的實現，在另一篇文章中將介紹餅圖的實現。
    為實現這個簡單的繪圖程式，首先構建了一個GraphDrawing專案工程。整個程式的設計思路相對較簡單，通過類BarGraph來實現對條形圖的繪製，通過WinForm窗體來實現對圖形資料的輸入及輸出。此外，還特別增加了一個工具類Utils，裡面包含了公共靜態方法，當前用來獲取圖形繪製的顏色列表。
    整個繪圖程式的實現，均是通過C#中的GDI+來處理的，只要充分利用GDI+中的各種方法，繪製這麼一個相對簡單的圖形也就不成問題了。繪製條形圖大體經過以下幾個步驟：
    （1）建立Graphics物件例項；
    （2）設定圖形及文字的屬性；
    （3）設定畫布和邊框；
    （4）繪製標題文字；
    （5）迴圈繪製條形圖；
    （6）繪製X及Y座標的線條及文字；
    （7）繪製圖例。
    以下是BarGraph類的程式碼示例：
using System; using System.Data; using System.Drawing; using System.Drawing.Text; using System.Drawing.Drawing2D; using System.Collections.Generic; namespace GraphDrawing { class BarGraph { #region Member fields /// <summary> /// The color list for each bar drawing /// </summary> private List<Color> m_colorList; /// <summary> /// The data for graph drawing /// </summary> private DataTable m_dataTable; /// <summary> /// The width of graph /// </summary> private int m_width; /// <summary> /// The height of graph /// </summary> private int m_height; /// <summary> /// The legend width of graph /// </summary> private int m_legendWidth; #endregion #region Public properties /// <summary> /// The title of graph /// </summary> public string GraphTitle { get; set; } /// <summary> /// The font format of graph /// </summary> public string FontFormat { get; set; } /// <summary> /// The x axis label name of graph /// </summary> public string XLabelName { get; set; } /// <summary> /// The y axis label name of graph /// </summary> public string YLabelName { get; set; } #endregion /// <summary> /// Constructor with arguments /// </summary> /// <param name="width">the graph width</param> /// <param name="height">the graph height</param> /// <param name="legendWidth">the graph legend width</param> /// <param name="dataTable">the graph data</param> public BarGraph(int width, int height, int legendWidth, DataTable dataTable) { m_width = width; m_height = height; m_legendWidth = legendWidth; m_dataTable = dataTable; m_colorList = Utils.GetColorList(); } /// <summary> /// Generate Bar graph /// </summary> /// <returns>bitmap</returns> public Bitmap DrawBarGraph() { int iChartTop = 75; int iChartLeft = 50; int iChartWidth = m_width - 250; int iChartHeight = m_height - 150; // Calculate the high point float fHighPoint = 0; foreach (DataRow row in m_dataTable.Rows) { if (fHighPoint < Convert.ToSingle(row[1])) { fHighPoint = Convert.ToSingle(row[1]); } } // Create an object of Graphics Bitmap bitmap = new Bitmap(m_width, m_height); Graphics graph = Graphics.FromImage(bitmap); // Set the attribute of bar and text graph.ScaleTransform(1, 1); graph.SmoothingMode = SmoothingMode.Default; graph.TextRenderingHint = TextRenderingHint.AntiAlias; // Set the canvas and the border graph.Clear(Color.White); graph.DrawRectangle(Pens.Green, 0, 0, m_width - 5, m_height - 5); // Draw the graph title graph.DrawString(GraphTitle, new Font(FontFormat, 14), Brushes.Black, new PointF(7, 35)); // Draw the bar float barWidth = iChartWidth / (m_dataTable.Rows.Count * 2); float barHeight = m_dataTable.Rows.Count; PointF barOrigin = new PointF(iChartLeft + (barWidth / 2), 0); for (int i = 0; i < m_dataTable.Rows.Count; i++) { barHeight = Convert.ToSingle(m_dataTable.Rows[i][1]) * 300 / fHighPoint; barOrigin.Y = iChartTop + iChartHeight - barHeight; graph.FillRectangle(new SolidBrush(m_colorList[i]), barOrigin.X, barOrigin.Y, barWidth, barHeight); barOrigin.X = barOrigin.X + (barWidth * 2); } // Draw the line of x axis and y axis graph.DrawLine(new Pen(Color.Black, 2), new Point(iChartLeft, iChartTop), new Point(iChartLeft, iChartTop + iChartHeight)); graph.DrawLine(new Pen(Color.Black, 2), new Point(iChartLeft, iChartTop + iChartHeight), new Point(iChartLeft + iChartWidth, iChartTop + iChartHeight)); // Draw the text of x axis graph.DrawString(XLabelName, new Font(FontFormat, 12), Brushes.Blue, new PointF(m_width - XLabelName.Length * 4 - 250, iChartTop + iChartHeight + 10)); // Draw the text of y axis StringFormat sf = new StringFormat(StringFormatFlags.DirectionVertical); graph.DrawString(YLabelName, new Font(FontFormat, 12), Brushes.Blue, new PointF(iChartLeft - 25, iChartTop), sf); // Draw the legend of graph bitmap = DrawLegend(bitmap); return bitmap; } /// <summary> /// Generate the legend /// </summary> /// <param name="graph"></param> /// <returns></returns> private Bitmap DrawLegend(Bitmap graph) { Bitmap bitmap = new Bitmap(250, m_height); Graphics objGraphic = Graphics.FromImage(bitmap); Graphics graphic = Graphics.FromImage(graph); int i, x; for (i = 0, x = m_legendWidth; i < m_dataTable.Rows.Count; i++) { //Draw the bar SolidBrush brush = new SolidBrush(m_colorList[i]); objGraphic.FillRectangle(brush, 10, m_height - 90 - x, m_legendWidth, m_legendWidth); string drawString = m_dataTable.Rows[i][0].ToString() + " - " + m_dataTable.Rows[i][1].ToString(); Font drawFont = new Font(FontFormat, 8); SolidBrush drawBrush = new SolidBrush(Color.Black); objGraphic.DrawString(drawString, drawFont, drawBrush, m_legendWidth * 2, m_height - 90 - x); //x axis spacing by m_legendWidth + 5 x += m_legendWidth + 5; } // Draw the string and the rectangle for the legend graphic.DrawRectangle(new Pen(Color.Purple, 1), m_width - 180, m_height - 85 - x, 160, x + 10); graphic.DrawString("Legend", new Font(FontFormat, 11, FontStyle.Bold), Brushes.Purple, new PointF(m_width - 180, m_height - 110 - x)); graphic.DrawImage(bitmap, m_width - 180, 10); return (graph); } } }

    在WinForm中，呼叫也非常簡單，程式碼示例如下：
/// <summary> /// Draw the bar graph /// </summary> private void DrawBarGraph() { this.ReadInputData(); string strTitle = txtGraphTitle.Text; string strFont = "Courier"; string strXLabel = txtXLabel.Text + " →"; string strYLabel = "← " + txtYLabel.Text; int iWidth = picBarGraph.Width; int iHeight = picBarGraph.Height; int iLegendWidth = (iWidth - 200) / (m_dataTable.Rows.Count * 2); BarGraph barGraph = new BarGraph(iWidth, iHeight, iLegendWidth, m_dataTable); barGraph.GraphTitle = strTitle; barGraph.FontFormat = strFont; barGraph.XLabelName = strXLabel; barGraph.YLabelName = strYLabel; // Output the graph to the picture box picBarGraph.Image = barGraph.DrawBarGraph(); }

最終的條形圖繪製介面效果如下圖所示：

    以上是關於條形圖繪製的粗略介紹，該繪圖程式可適應窗體大小的變化。在後面筆者將會對該程式作進一步完善，以實現對餅圖的繪製。同時，需要說明的是，本繪圖程式的部分實現思路參考了相關原始碼，在此對相關原始碼的作者表示感謝。