ASP.NET画图系列之实现Bar图(柱状图)

 

前面已经实现了Pie和Curve图,今天我们来实现Bar,就是柱状图,这个的实现和前面2种基本上差不多,还是让我们先看看效果再说.

效果图:

下面开始页面部分:

页面最简单了,还是放一个<asp:Image ID="Image1" runat="server" />

我们看cs部分:

using System.Data.SqlClient;

using System.Drawing;

using System.Drawing.Imaging;

using SkyNet.Chart;

using SkyNet.OA.OAWebUtility;



public partial class SkyNetChart_MyBar : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{



if (!IsPostBack)

{

InitChart();

}

}

private void InitChart()

{



Bar barImg = new Bar(); //定义一个画图类实例



barImg.Title = "2008年销售情况统计表";

barImg.TextColor = Color.Red;

barImg.DS = GetDSBySale(); //这里若不设置，则采用默认的



string imgPath = "../ChartImages/" + "MyBar.jpg";

ChartHelper.CreateChartByBar(barImg, imgPath, ImageFormat.Jpeg);

this.Image1.ImageUrl = imgPath;

}

private DataSet GetDSBySale()

{

string constr = ""; //这里请大家自行设置



SqlConnection con = new SqlConnection(constr);

con.Open();

　　　　//注意前面第一个字段对应Keys,第二个字段为Values



string cmdStr = "select CountryName,SaleSum from SaleOfCountry ";   

        SqlDataAdapter da = new SqlDataAdapter(cmdStr, con);

DataSet ds = new DataSet();

da.Fill(ds, "SaleOfCountry");

return ds;

}



}

 

接下来我们看看Bar里面有什么:

 

Code
using System.Drawing;
using System.Data;

namespace SkyNet.Chart
{
    public class Bar
    {
        #region 私有字段
        private Graphics objGraphics; //Graphics 类提供将对象绘制到显示设备的方法
        private Bitmap objBitmap; //位图对象

        private int m_Width = 700; //图像宽度
        private int m_Height = 400; //图像高度
        private string m_Title = "××公司销售情况统计表";
        private string m_Unit = "万元";
        //键
        private string[] m_Keys = new string[] { "一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月" };
        //值
        private float[] m_Values = new float[] { 21.5f, 36.2f, 48.7f, 55.4f, 21.6f, 12.8f, 99.5f, 36.4f, 78.2f, 56.4f, 45.8f, 66.4f };
        private Color m_BgColor = Color.Snow; //背景
        private Color m_TextColor = Color.Black; //文字颜色
        private Color m_BorderColor = Color.Black; //整体边框颜色
        //Bar颜色数组
        private Color[] m_BarColor = new Color[] { Color.Green, Color.Red, Color.Yellow, Color.Blue, Color.Orange, Color.Aqua, 
            Color.SkyBlue, Color.DeepPink, Color.Teal, Color.Brown,Color.Navy,Color.Pink };
        private DataSet m_ds;
        #endregion

        #region 属性
        public DataSet DS
        {
            get { return m_ds; }
            set { m_ds = value; }
        }
        public int Width
        {
            set
            {
                if (value < 300)
                {
                    m_Width = 300;
                }
                else
                {
                    m_Width = value;
                }
            }
            get
            {
                return m_Width;
            }
        }

        public int Height
        {
            set
            {
                if (value < 300)
                {
                    m_Height = 300;
                }
                else
                {
                    m_Height = value;
                }
            }
            get
            {
                return m_Height;
            }
        }

        public string Title
        {
            set
            {
                m_Title = value;
            }
            get
            {
                return m_Title;
            }
        }

        public string Unit
        {
            set
            {
                m_Unit = value;
            }
            get
            {
                return m_Unit;
            }
        }

        public string[] Keys
        {
            set
            {
                m_Keys = value;
            }
            get
            {
                return m_Keys;
            }
        }

        public float[] Values
        {
            set
            {
                m_Values = value;
            }
            get
            {
                return m_Values;
            }
        }

        public Color BgColor
        {
            set
            {
                m_BgColor = value;
            }
            get
            {
                return m_BgColor;
            }
        }

        public Color TextColor
        {
            set
            {
                m_TextColor = value;
            }
            get
            {
                return m_TextColor;
            }
        }

        public Color BorderColor
        {
            set
            {
                m_BorderColor = value;
            }
            get
            {
                return m_BorderColor;
            }
        }

        public Color[] BarColor
        {
            set
            {
                m_BarColor = value;
            }
            get
            {
                return m_BarColor;
            }
        }
        #endregion

        private Color GetColor(int i) //分配各Bar的颜色
        {
            try
            {
                if (0 < i && i < BarColor.Length)
                {
                    return BarColor[i];
                }
                else if (i >= BarColor.Length)
                {
                    int j = i % BarColor.Length;
                    return BarColor[j];
                }
                else
                {
                    return Color.Green;
                }
            }
            catch
            {
                return Color.Green;
            }
        }

        //生成图像并返回bmp图像对象
        public Bitmap CreateImage()
        {
            InitializeGraph();

            DrawRight(ref objGraphics);

            DrawContent(ref objGraphics);

            return objBitmap;
        }

        //初始化和填充图像区域，画出边框，初始标题
        private void InitializeGraph()
        {
            //根据DS给Keys和Values赋值
            SetKeyValues();

            //根据给定的高度和宽度创建一个位图图像
            objBitmap = new Bitmap(Width, Height);

            //从指定的 objBitmap 对象创建 objGraphics 对象 (即在objBitmap对象中画图)
            objGraphics = Graphics.FromImage(objBitmap);

            //根据给定颜色(LightGray)填充图像的矩形区域 (背景)
            objGraphics.DrawRectangle(new Pen(BorderColor, 1), 0, 0, Width, Height);
            objGraphics.FillRectangle(new SolidBrush(BgColor), 1, 1, Width - 2, Height - 2);

            //初始化标题
            CreateTitle(ref objGraphics);
        }

        //根据DS给Keys和Values赋值
        private void SetKeyValues()
        {
            if (DS != null)
            {
                DataTable dt = DS.Tables[0];
                DataRow dr;
                int rows = dt.Rows.Count;
                string[] keys = new string[rows];
                float[] values = new float[rows];
                for (int i = 0; i < rows; i++)
                {
                    dr = dt.Rows[i];
                    keys[i] = dr[0].ToString();
                    values[i] = Convert.ToSingle(dr[1]) / 10000;
                }
                Keys = keys;
                Values = values;
            }
            else
            {
                Keys = m_Keys;
                Values = m_Values;
            }
        }

        //初始化邮编说明部分
        private void DrawRight(ref Graphics objGraphics)
        {
            objGraphics.DrawString(String.Format("单位：{0}", Unit), new Font("宋体", 10), new SolidBrush(TextColor), Width - 100, 30);

            Point KeysPoint = new Point(Width - 95, 50);
            Point KeysTextPoint = new Point(Width - 70, 50);
            for (int i = 0; i < Keys.Length; i++)
            {
                objGraphics.DrawRectangle(new Pen(BorderColor, 1), KeysPoint.X, KeysPoint.Y, 21, 11);
                objGraphics.FillRectangle(new SolidBrush(GetColor(i)), KeysPoint.X, KeysPoint.Y, 20, 10);
                objGraphics.DrawString(Keys[i], new Font("宋体", 10), new SolidBrush(TextColor), KeysTextPoint);
                KeysPoint.Y += 15;
                KeysTextPoint.Y += 15;
            }
        }

        //Bar图的主要部分
        private void DrawContent(ref Graphics objGraphics)
        {
            Point KeysPoint = new Point(20, Height - 20);
            Point KeysTextPoint = new Point(20, Height - 20);

            int SpaceWidth = (Width - 120) / (Values.Length * 2);
            float SpaceHeight;
            float maxV;

            //画Bar
            for (int i = 0; i < Values.Length; i++)
            {
                maxV = MaxValues(Values);
                SpaceHeight = (Height - 100) * (Values[i] / maxV);

                objGraphics.DrawRectangle(new Pen(BorderColor, 1), KeysPoint.X, KeysPoint.Y - SpaceHeight, SpaceWidth + 1, SpaceHeight + 1);
                objGraphics.FillRectangle(new SolidBrush(GetColor(i)), KeysPoint.X, KeysPoint.Y - SpaceHeight, SpaceWidth, SpaceHeight);
                KeysPoint.X += SpaceWidth * 2;
            }

            //画Bar上的数值,不和上边同时进行操作是因为Bar柱有可能覆盖了数值的显示，所以要分开
            for (int i = 0; i < Values.Length; i++)
            {
                maxV = MaxValues(Values);
                SpaceHeight = (Height - 100) * (Values[i] / maxV);
                KeysTextPoint.Y = (int)(KeysPoint.Y - SpaceHeight - 20);
                objGraphics.DrawString(Values[i].ToString(), new Font("宋体", 10), new SolidBrush(TextColor), KeysTextPoint);
                KeysTextPoint.X += SpaceWidth * 2;
            }
        }

        //初始化标题
        private void CreateTitle(ref Graphics objGraphics)
        {
            objGraphics.DrawString(Title, new Font("宋体", 16), new SolidBrush(TextColor), new Point(5, 5));
        }

        //获取数组的最大值,这里暂时用排序算法得到最大值，应该用检索方法的。
        private float MaxValues(float[] Values)
        {
            float[] SortValues = new float[Values.Length];
            for (int i = 0; i < Values.Length; i++)
            {
                SortValues[i] = Values[i];
            }
            //SortValues = Sort.BubbleSort(SortValues); //没有找到Sort类，所以自己在下面写了个排序
            SortValues = Bar.BubbleSort(SortValues);
            return SortValues[SortValues.Length - 1];
        }
        //下面是我自己添加的
        public static float[] BubbleSort(float[] SortValues)
        {
            float temp = 0;
            for (int i = 0; i < SortValues.Length - 1; i++)
            {
                for (int j = i + 1; j < SortValues.Length; j++)
                {
                    if (SortValues[i] > SortValues[j])
                    {
                        temp = SortValues[i];
                        SortValues[i] = SortValues[j];
                        SortValues[j] = temp;
                    }
                }
            }
            return SortValues;
        }
    }
}

 

最后是一个CreateChartByBar方法,我们来看

 

 /// <summary>

/// 创建一个Bar图--柱状图

/// </summary>

/// <param name="barImg">Bar类的实例(设置标题、宽度、高度等)</param>

/// <param name="imgPath">生成Bar图的图片路径(相对路径)</param>

/// <param name="imgFormat">生成Bar图的图片格式(如：ImageFormat.Jpeg)</param>

        public static void CreateChartByBar(Bar barImg, string imgPath, 

　　　　ImageFormat imgFormat)

{

try

{

if (barImg == null)

{

barImg.Title = "Bar图统计表示例";

barImg.TextColor = Color.Red;

}



Bitmap bmp = barImg.CreateImage();

string savePath = HttpContext.Current.Server.MapPath(imgPath);

bmp.Save(savePath, imgFormat);

}

catch (Exception ee)

{

throw ee;

}

}

好了,效果已经出来了,大家可以拿下来自己测试下,若有什么问题请留言或Email给我

我的邮件地址是:gfreesky@gmail.com