ASP.Net绘制柱状图和曲线图示例

ASP.Net绘制柱状图和曲线图示例

public class WebForm1 : System.Web.UI.Page
{
  private void Page_Load(object sender, System.EventArgs e)
  {
  //This is the interface to outer usage
  int widthValue = 800;
  int heightValue = 500;
  String xTitle,yTitle;
  int offsetX = 20;
  int offsetY = 20;
  //柱状图之间的间距
  int spaceSpan = 15;
 
  xTitle = "Time";
  yTitle = "Sum";

  Bitmap imgBitmap = new Bitmap(widthValue+5*offsetX,heightValue+offsetY*2,PixelFormat.Format32bppPArgb);
  Graphics g = Graphics.FromImage(imgBitmap);
  g.Clear(Color.Snow);
  Pen linePen = new Pen(Color.Black);
  linePen.Width = 2;
  //Draw Title
  Font txtFont = new Font("Courier",10,GraphicsUnit.Point);
  String title= "This is the title to be displayed";
  g.DrawString(title,txtFont,Brushes.Blue,new PointF(imgBitmap.Width/2,0));
  Point original = new Point(offsetX,heightValue+offsetY);
  Point xEndPonit = new Point(widthValue+offsetX ,heightValue+offsetY);
  Point yEndPonit = new Point(offsetX,0);
  //X coordinate
  g.DrawLine(linePen,original,xEndPonit);
  //Y Coordinate
  g.DrawLine(linePen,original,yEndPonit);
  //Draw arrows
  Point leftArrowStart = new Point(offsetX*3/4 ,offsetY/3);
  Point rightArrowEnd = new Point(offsetX*5/4,offsetY/3);
  g.DrawLine(linePen,leftArrowStart,yEndPonit);
  g.DrawLine(linePen,yEndPonit,rightArrowEnd);
 
  Point topArrowStart = new Point(widthValue + offsetX*3/4,heightValue +  offsetY*3/4);
  Point bottomArrowEnd = new Point(widthValue+ offsetX*3/4,heightValue  + offsetY*5/4);
  g.DrawLine(linePen,topArrowStart,xEndPonit);
  g.DrawLine(linePen,xEndPonit,bottomArrowEnd);
 
 
  //Draw X-Title
g.DrawString(xTitle,txtFont,Brushes.Blue,new PointF(bottomArrowEnd.X-g.MeasureString(xTitle,txtFont).Width,topArrowStart.Y +10));
  StringFormat f = new StringFormat();
  //f.Alignment = StringAlignment.Center;
  //Draw Y-Title
  f.LineAlignment = StringAlignment.Center;
  g.DrawString(yTitle,txtFont,Brushes.Blue,new PointF(offsetX * 5/3,15),f);
 
  //画单个柱状图的代码
 
  //测试数据
  /**
  int[] staticData = new int[]{20,30,80,50,200,120,20,30,80,50,200,120,60,90,140};
 
  int maxValue = MaxValue(staticData);
 
  int ratio = heightValue/maxValue;
  int groupCount = staticData.Length; //柱状图组数
  ResetValue(staticData,ratio);
 
  int rectWidth = (widthValue - (groupCount +1)*spaceSpan )/ groupCount;
  Rectangle rect;
  int startX = offsetX + spaceSpan; //起始坐标点
  for(int i=0;i
  {
    rect = new Rectangle(startX,heightValue +offsetY - staticData,rectWidth,staticData);
    g.DrawRectangle(Pens.Green,rect);
    g.FillRectangle(Brushes.Green,rect);
    startX = startX + rectWidth + spaceSpan;
  }
  **/
//  Type t = dataList.GetType();
//  if(t.IsArray)
//  {
//  }
  //画分组柱状图代码
  ArrayList dataList = new ArrayList();
  int[] data1= new int[]{20,30,50,100};
  int[] data2 = new int[]{50,60,30,30};
  int[] data3 = new int[]{80,50,60,85};
  int[] data4= new int[]{20,30,90,58};
  int[] data5 = new int[]{50,60,30,30};
  int[] data6 = new int[]{80,50,60,85};
  int[] data7= new int[]{20,30,90,58};
  dataList.Add(data1);
  dataList.Add(data2);
  dataList.Add(data3);
  dataList.Add(data4);
  dataList.Add(data5);
  dataList.Add(data6);
  dataList.Add(data7);
  int maxValue = MaxValue(dataList);
  int ratio = heightValue/maxValue;
  int groupCount = dataList.Count; //柱状图组数
  ResetValue(dataList,ratio);
 
  //根据比率画坐标
  //Draw X-Grids, The height value is divided into 10 parts
  int heightStep = heightValue/10;
  Point point1,point2;
  for(int i=1;i<=10;i++)
  {
    point1 = new Point(offsetX*3/4,offsetY+heightValue - heightStep*i);
    point2 = new Point(offsetX,point1.Y);
    g.DrawLine(Pens.Black,point1,point2);
    String text = maxValue/10*i+"";
    g.DrawString(text,txtFont,Brushes.Blue,new PointF(-2,point1.Y));
  }
  //画坐标结束
  int rectWidth = (widthValue - (groupCount +1)*spaceSpan )/ groupCount;
  int innerGroupCount = GetInnerGroupCount(dataList);
  int innerWidth = rectWidth / innerGroupCount;
  Rectangle rect;
  int startX = offsetX + spaceSpan; //起始坐标点
  for(int i=0;i
  {
    int[] staticData = (int[])dataList;
    for(int j=0;j
    {
    rect = new Rectangle(startX,heightValue +offsetY - staticData[j],innerWidth,staticData[j]);
    g.DrawRectangle(GetPenColor(j),rect);
    g.FillRectangle(GetBrushColor(j),rect);
    startX = startX + innerWidth;
    }
    startX = startX + spaceSpan;
  }
  //画曲线
  Point pnt1 = new Point(200+offsetX,heightValue+offsetY-300);
  Point pnt2 = new Point(300+offsetX,heightValue+offsetY-500);
  Point pnt3 = new Point(400+offsetX,heightValue+offsetY-300);
  Point pnt4 = new Point(600+offsetX,heightValue+offsetY-600);
  g.DrawCurve(Pens.Purple,new Point[]{pnt1,pnt2,pnt3,pnt4});
  //画饼图
  g.DrawPie ( Pens.Red , 50 , 50 , 150 , 150 , 0 , 30 ) ;
  imgBitmap.Save(Response.OutputStream,ImageFormat.Gif);
  }

代码中涉及到的函数如下:
private int MaxValue(int[] data)
  {
  int maxValue = 0;
  for(int i=0;i
  {
    if(data>maxValue)
    maxValue = data;
  }
  return maxValue;
  }
  private int MaxValue(ArrayList dataList)
  {
  int maxValue = 0;
  for(int i=0;i
  {
    int newMaxValue = MaxValue((int[])dataList);
    if( newMaxValue>maxValue)
    maxValue = newMaxValue;
  }
  return maxValue;
  }
  private void ResetValue(int[] data,int ratio)
  {
  for(int i=0;i
    data *= ratio;
  }
  private void ResetValue(ArrayList dataList,int ratio)
  {
  for(int i=0;i
  {
    ResetValue((int[])dataList,ratio);
  }
  }
  private int GetInnerGroupCount(ArrayList dataList)
  {
  int groupCount = 0;
  for(int i=0;i
  {
    int count = ((int[])dataList).Length;
    if(count>groupCount)
    groupCount = count;
  }
  return groupCount;
  }
  private Pen GetPenColor(int index)
  {
  Pen linePen = new Pen(Color.Black);
  linePen.Width = 1;
  linePen.CompoundArray = new float[]{0.0F,0.2F};
  switch(index)
  {
    case 0:
    linePen.Color = Color.Gray;
    break;
    case 1:
    linePen.Color = Color.Green;
    break;
    case 2:
      linePen.Color = Color.Blue;
    break;
    case 3:
    linePen.Color = Color.Purple;
    break;
  }
  return linePen;
  }
  private Brush GetBrushColor(int index)
  {
  switch(index)
  {
    case 0:
    return Brushes.Gray;
    case 1:
    return Brushes.Green;
    case 2:
    return Brushes.Blue;
    case 3:
    return Brushes.Purple;
  }
  return Brushes.Red;
  }
------------------------------------------------------------
多多交流!

TOP

 

回复:ASP.Net绘制柱状图和曲线图示例



不错,好像少了一些明显的代码,调试了一下,如下:

public partial class Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        int widthvalue = 800;
        int heightvalue = 500;
        string xTile, yTitle;
        int offsetX = 20;
        int offsetY = 20;
        //柱状之间的间距
        int spaceSpan = 15;

        xTile = "Title";
        yTitle = "Sum";

        Bitmap imgbitmap = new Bitmap(widthvalue + 5 * offsetX, heightvalue + 2 * offsetY, PixelFormat.Format32bppArgb);
        Graphics g = Graphics.FromImage(imgbitmap);
        g.Clear(Color.Snow);
        Pen linePen = new Pen(Color.Black);
        linePen.Width = 2;
        //Draw Title
        Font txtFont = new Font("Courier", 10, GraphicsUnit.Point);
        String title = "This is the title to be displayed";
        g.DrawString(title, txtFont, Brushes.Blue, new PointF(imgbitmap.Width / 2, 0));
        Point original = new Point(offsetX, heightvalue + offsetY);
        Point xEndPonit = new Point(widthvalue + offsetX, heightvalue + offsetY);
        Point yEndPonit = new Point(offsetX, 0);
        //X coordinate
        g.DrawLine(linePen, original, xEndPonit);
        //Y Coordinate
        g.DrawLine(linePen, original, yEndPonit);
        //Draw arrows
        Point leftArrowStart = new Point(offsetX * 3 / 4, offsetY / 3);
        Point rightArrowEnd = new Point(offsetX * 5 / 4, offsetY / 3);
        g.DrawLine(linePen, leftArrowStart, yEndPonit);
        g.DrawLine(linePen, yEndPonit, rightArrowEnd);

        Point topArrowStart = new Point(widthvalue + offsetX * 3 / 4, heightvalue + offsetY * 3 / 4);
        Point bottomArrowEnd = new Point(widthvalue + offsetX * 3 / 4, heightvalue + offsetY * 5 / 4);
        g.DrawLine(linePen, topArrowStart, xEndPonit);
        g.DrawLine(linePen, xEndPonit, bottomArrowEnd);

        //Draw X-Title
        g.DrawString(xTile, txtFont, Brushes.Blue, new PointF(bottomArrowEnd.X - g.MeasureString(xTile, txtFont).Width, topArrowStart.Y + 10));
        StringFormat f = new StringFormat();
        //f.Alignment = StringAlignment.Center;
        //Draw Y-Title
        f.LineAlignment = StringAlignment.Center;
        g.DrawString(yTitle, txtFont, Brushes.Blue, new PointF(offsetX * 5 / 3, 15), f);

        //画单个柱状图的代码

        //测试数据
        /**
        int[] staticData = new int[]{20,30,80,50,200,120,20,30,80,50,200,120,60,90,140};
 
        int maxValue = MaxValue(staticData);
 
        int ratio = heightvalue/maxValue;
        int groupCount = staticData.Length; //柱状图组数
        ResetValue(staticData,ratio);
 
        int rectWidth = (widthvalue - (groupCount +1)*spaceSpan )/ groupCount;
        Rectangle rect;
        int startX = offsetX + spaceSpan; //起始坐标点
        for(int i=0;i
        {
          rect = new Rectangle(startX,heightvalue +offsetY - staticData,rectWidth,staticData);
          g.DrawRectangle(Pens.Green,rect);
          g.FillRectangle(Brushes.Green,rect);
          startX = startX + rectWidth + spaceSpan;
        }
        **/
        //  Type t = dataList.GetType();
        //  if(t.IsArray)
        //  {
        //  }
        //画分组柱状图代码
        ArrayList dataList = new ArrayList();
        int[] data1 = new int[] { 20, 30, 50, 100 };
        int[] data2 = new int[] { 50, 60, 30, 30 };
        int[] data3 = new int[] { 80, 50, 60, 85 };
        int[] data4 = new int[] { 20, 30, 90, 58 };
        int[] data5 = new int[] { 50, 60, 30, 30 };
        int[] data6 = new int[] { 80, 50, 60, 85 };
        int[] data7 = new int[] { 20, 30, 90, 58 };
        dataList.Add(data1);
        dataList.Add(data2);
        dataList.Add(data3);
        dataList.Add(data4);
        dataList.Add(data5);
        dataList.Add(data6);
        dataList.Add(data7);
        int maxValue = MaxValue(dataList);
        int ratio = heightvalue / maxValue;
        int groupCount = dataList.Count; //柱状图组数
        ResetValue(dataList, ratio);


        //根据比率画坐标
        //Draw X-Grids, The height value is divided into 10 parts
        int heightStep = heightvalue / 10;
        Point point1, point2;
        for (int i = 1; i <= 10; i++)
        {
            point1 = new Point(offsetX * 3 / 4, offsetY + heightvalue - heightStep * i);
            point2 = new Point(offsetX, point1.Y);
            g.DrawLine(Pens.Black, point1, point2);
            String text = maxValue / 10 * i + "";
            g.DrawString(text, txtFont, Brushes.Blue, new PointF(-2, point1.Y));
        }

        //画坐标结束
  int rectWidth = (widthvalue - (groupCount +1)*spaceSpan )/ groupCount;
  int innerGroupCount = GetInnerGroupCount(dataList);
  int innerWidth = rectWidth / innerGroupCount;
  Rectangle rect;
  int startX = offsetX + spaceSpan; //起始坐标点
  for(int i=0;i<dataList.Count;i++)
  {
    int[] staticData = (int[])dataList;
    for(int j=0;j<staticData.Length;j++)
    {
    rect = new Rectangle(startX,heightvalue +offsetY - staticData[j],innerWidth,staticData[j]);
    g.DrawRectangle(GetPenColor(j),rect);
    g.FillRectangle(GetBrushColor(j),rect);
    startX = startX + innerWidth;
    }
    startX = startX + spaceSpan;
  }

        //画曲线
  Point pnt1 = new Point(200+offsetX,heightvalue+offsetY-300);
  Point pnt2 = new Point(300+offsetX,heightvalue+offsetY-500);
  Point pnt3 = new Point(400+offsetX,heightvalue+offsetY-300);
  Point pnt4 = new Point(600+offsetX,heightvalue+offsetY-600);
        g.DrawCurve(Pens.Purple,new Point[]{pnt1,pnt2,pnt3,pnt4});
  //g.DrawCurve(Pens.Purple,new Point[]{pnt1,pnt2,pnt3,pnt4});
  //画饼图
  g.DrawPie ( Pens.Red , 50 , 50 , 150 , 150 , 0 , 30 ) ;
  imgbitmap.Save(Response.OutputStream,ImageFormat.Gif);
    }

    private int MaxValue(int[] data)
  {
int maxValue = 0;
  for(int i=0;i<data.Length;i++)
  {
    if(data>maxValue)
    maxValue = data;
  }
  return maxValue;
  }
    private int MaxValue(ArrayList dataList)
    {
        int maxValue = 0;
        for (int i = 0; i < dataList.Count; i++)
        {
            int newMaxValue = MaxValue((int[])dataList);
            if (newMaxValue > maxValue)
                maxValue = newMaxValue;
        }
        return maxValue;
    }
    private void ResetValue(int[] data, int ratio)
    {
        for (int i = 0; i < data.Length; i++)
            data *= ratio;
    }
    private void ResetValue(ArrayList dataList, int ratio)
    {
        for (int i = 0; i < dataList.Count; i++)
        {
            ResetValue((int[])dataList, ratio);
        }
    }
    private int GetInnerGroupCount(ArrayList dataList)
    {
        int groupCount = 0;
        for (int i = 0; i < dataList.Count; i++)
        {
            int count = ((int[])dataList).Length;
            if (count > groupCount)
                groupCount = count;
        }
        return groupCount;
    }
    private Pen GetPenColor(int index)
    {
        Pen linePen = new Pen(Color.Black);
        linePen.Width = 1;
        linePen.CompoundArray = new float[] { 0.0F, 0.2F };
        switch (index)
        {
            case 0:
                linePen.Color = Color.Gray;
                break;
            case 1:
                linePen.Color = Color.Green;
                break;
            case 2:
                linePen.Color = Color.Blue;
                break;
            case 3:
                linePen.Color = Color.Purple;
                break;
        }
        return linePen;
    }
    private Brush GetBrushColor(int index)
    {
        switch (index)
        {
            case 0:
                return Brushes.Gray;
            case 1:
                return Brushes.Green;
            case 2:
                return Brushes.Blue;
            case 3:
                return Brushes.Purple;
        }
        return Brushes.Red;
    }
}
原文地址:https://www.cnblogs.com/jazzka702/p/1503266.html