C# Tutorials and offshore development in India
    Tutorials   Resources   Forum   Reviews   Communities   Interview   Jobs   Projects   Training   Your Ad Here    
Silverlight Games | Mentor | Code Converter | Articles | Code Factory | Computer Jokes | Members | Peer Appraisal | IT Companies | Bookmarks | Polls | Revenue Sharing | Lobby | Gift Shop |


Prizes & Awards
My Profile



Active Members
TodayLast 7 Days more...






Resources » Articles » ASP.NET/Web Applications »

Generating Bar Chart in ASP.net


Posted Date: 09 Nov 2004    Resource Type: Articles    Category: ASP.NET/Web Applications
Author: JASMember Level: Silver    
Rating: 1 out of 5Points: 10



Introduction

The following example demonstrates how to generate bar-charts for any business information available on a web page. This uses the classes which are provided in the .net System.Drawing namespace to draw generate the chart.

Bar chart created in the below example illustrates the Profit of a company for each month from January through December.

Generating the Bar chart

Data which is to be displayed on X axis and Y axis is stored in the ArrayLists and then the data is read from these ArrayLists for creating the required bar chart.

First the ArrayLists are populated as follows:

Dim aMonths As ArrayList = New ArrayList(), aProfits As ArrayList = New ArrayList()
aMonths.Add("January")
aMonths.Add("February")
aMonths.Add("March")
aMonths.Add("April")
aMonths.Add("May")
aMonths.Add("June")
aMonths.Add("July")
aMonths.Add("August")
aMonths.Add("September")
aMonths.Add("October")
aMonths.Add("November")
aMonths.Add("December")

aProfits.Add(240500)
aProfits.Add(220950)
aProfits.Add(283500)
aProfits.Add(340000)
aProfits.Add(325750)
aProfits.Add(123456)
aProfits.Add(235621)
aProfits.Add(345235)
aProfits.Add(290451)
aProfits.Add(152345)
aProfits.Add(653456)
aProfits.Add(785620)

Once the data is populated the chart can be generated by calling the method DrawBarGraph:

DrawBarGraph("Profits!", aMonths, aProfits)

DrawBarGraph is defined as follows:

Sub DrawBarGraph(ByVal strTitle As String, ByVal aX As ArrayList, ByVal aY As ArrayList)
Const iColWidth As Integer = 60, iColSpace As Integer = 25, iMaxHeight As Integer = 400, iHeightSpace As Integer = 25, iXLegendSpace As Integer = 30, iTitleSpace As Integer = 50
Dim iMaxWidth As Integer = (iColWidth + iColSpace) * aX.Count + iColSpace, iMaxColHeight As Integer = 0, iTotalHeight As Integer = iMaxHeight + iXLegendSpace + iTitleSpace

Dim objBitmap As Bitmap = New Bitmap(iMaxWidth, iTotalHeight)
Dim objGraphics As Graphics = Graphics.FromImage(objBitmap)

objGraphics.FillRectangle(New SolidBrush(Color.White), 0, 0, iMaxWidth, iTotalHeight)
objGraphics.FillRectangle(New SolidBrush(Color.Ivory), 0, 0, iMaxWidth, iMaxHeight)

' find the maximum value
Dim iValue As Integer
For Each iValue In aY
If iValue > iMaxColHeight Then iMaxColHeight = iValue
Next

Dim iBarX As Integer = iColSpace, iCurrentHeight As Integer
Dim objBrush As SolidBrush = New SolidBrush(Color.FromArgb(70, 20, 20))
Dim fontLegend As Font = New Font("Arial", 11), fontValues As Font = New Font("Arial", 8), fontTitle As Font = New Font("Arial", 24)

' loop through and draw each bar
Dim iLoop As Integer
For iLoop = 0 To aX.Count - 1
iCurrentHeight = ((Convert.ToDouble(aY(iLoop)) / Convert.ToDouble(iMaxColHeight)) * Convert.ToDouble(iMaxHeight - iHeightSpace))
objGraphics.FillRectangle(objBrush, iBarX, _
iMaxHeight - iCurrentHeight, iColWidth, iCurrentHeight)
objGraphics.DrawString(aX(iLoop), fontLegend, objBrush, iBarX, iMaxHeight)
objGraphics.DrawString(Format(aY(iLoop), "#,###"), fontValues, objBrush, iBarX, iMaxHeight - iCurrentHeight - 15)
iBarX += (iColSpace + iColWidth)
Next
objGraphics.DrawString(strTitle, fontTitle, objBrush, (iMaxWidth / 2) - strTitle.Length * 6, iMaxHeight + iXLegendSpace)
'objBitmap.Save("C:\inetpub\wwwroot\graph.gif", ImageFormat.GIF)
objBitmap.Save(Response.OutputStream, ImageFormat.Gif)
objGraphics.Dispose()
objBitmap.Dispose()
End Sub


This code will generate the bar chart and display it on the screen. Also if required the bar chart can be saved as an image, just uncomment the line below in the above code.

objBitmap.Save("C:\inetpub\wwwroot\graph.gif", ImageFormat.GIF)




Responses

Author: Siddesh Kapadi    22 Apr 2005Member Level: Bronze   Points : 0
please help me in developing graphs other than bar chart like line graph, curve graph, dot graph, pie chart, etc...


Feedbacks      
Popular Tags   What are tags ?   Search Tags  
Sign In to add tags.
(No tags found.)

Post Feedback


This is a strictly moderated forum. Only approved messages will appear in the site. Please use 'Spell Check' in Google toolbar before you submit.
You must Sign In to post a response.
Next Resource: Paging in ASP.NET Part I
Previous Resource: How to capture the process time of an aspx page
Return to Discussion Resource Index
Post New Resource
Category: ASP.NET/Web Applications


Post resources and earn money!
 
Related Resources



dotNet Slackers

About Us    Contact Us    Privacy Policy    Terms Of Use