Professional Touch International Inc.   
About Us   Home   Questionnaire    Shopping Cart    Your Account    Help   

Login
(954) 430-5263 
Contact Us

Product Categories
Windows Applications
Web Applications
Web Services
Web Pages
Web Controls
Smart Windows Applications
SQL Tables
SQL Views
SQL Stored Procedures
SQL User Defined Functions
N-Tier Classes
Hosted Solutions
Windows Services
Smart Clients
Windows Techniques
ASP.NET Techniques
Miscellaneous Techniques
Pre-Packaged Solutions
ASP.NET List Control
Consulting Hours
Remoting
Dynamic Documentation
Deployment
One-Time Fees
On-Going Fees
Visual Studio 2010 & .Net 4.0
 
Other Site Pages
Products
Smart Applications
Synergy Ingredients
Web Services vs Remote
FAQs
Revolutionary Concepts
MMIT vs SDE
Dynamic Graphs
Dynamic Documentation

Dynamic Graphs

The following illustrates three very powerful techniques to create dynamic graphs using the new Graphics Device Interface or GDI+ capabilities of the .NET Framework. 

1. Bar Graphs via a different asp.net page

The following graph shows the total amount of E-Commerce retail sales in the United States from 1999 through 2002, as reported by the Census Bureau of the Department of Commerce. The fourth quarter of 2002 was $14.334 billion, an increase of 28.2 percent from the fourth quarter of 2001. Total retail sales for the fourth quarter of 2002 were estimated at $869.6 billion, an increase of 1.6 percent from the same period a year ago.

This technique involves  creating one web page named Barchart.aspx, setting its ContentType to "image/gif" and using the objects exposed by the System.Drawing and System.Drawing.Drawing2D namespaces. You can view the Barchart.aspx page by clicking here. 

We draw the image in the forms load event of this page as the page includes an image tag with a source of the Barchart.aspx page as in

<IMG id="DetailBarchartImage" src="Barchart.aspx" align="absMiddle" useMap="">

To view the complete E-Commerce retail sales in the United States from 1999 through 2002 article Click Here

The above technique was demonstrated by Carlos R. Guevara L., MSDN Regional Director Panama, on his webcast "ASP .NET - Tips and Tricks" on 2-13-2003 (great webcast!).  To view it,  Click Here 

 

To create your own version of the graph itself, enter a value between 0 and 10,000 on the textboxes below and click Redraw Graph.

99Q4

00Q100Q200Q300Q4

01Q101Q201Q301Q4

02Q102Q202Q302Q4

 

2. Graphics created via an HTTP handler

On August 2002's MSDN magazine, Jeff Prosise shows us how to use HTTP handlers to generate dynamic images in his column "Wicked Code - Code your way to ASP.NET excellence". 1 line of code on this page 

Chart.ImageUrl = String.Format("HTTPHandlers\PieChart.ashx?q1= {0}&q2= {1}&q3= {2}&q4= {3}" + _ "&width= 256&height= 224", Q1.Text, Q3.Text, Q3.Text, Q4.Text)

and a few more lines of code in the implementation of the ProcessRequest method of the HTTP handler class inside the PieChart.ashx file named PieChartGenerator that inherits from IHttpHandler and,

1st Quarter
2nd Quarter
3rd Quarter
4th Quarter
Pie Chart

Technically, an IHttpAsyncHandler class can be associated with a file name extension or a particular URL by a configuration file, in the <httpHandlers> section. The ASP.NET infrastructure will then instantiate and call the handler when the corresponding request is received. Alternatively, the handler can be defined in an .ashx file and when the corresponding request is received for the .ashx file, the hander will be executed. The example uses the later via a C# program. It is invoked by the on_click event of the ShowChart button by setting the image's imageURL property to the it and passing the values entered on the textboxes for each quarter.

3. Creating your own bitmap.

ltImage.Text = String.Format("<img src='DrawString.aspx?Text={0}&Font={1}&Size={2}&Style={3}&Color={4}BackColor={5}&StringFormat={6}'>", strText, strFontName, intFontSize, _ CType(fs, Integer), _ ddlTextColor.SelectedItem.Text, _ ddlBackColor.SelectedItem.Text, _ CType(sfmtFlags, Integer))

On the April 2003 issue of the asp.netPRO magazine, Ken Getz shows us how to generate graphics with GDI+.

Select a Font:

Enter Text:  
Font Size:  
Style:
Text Color:
Background Color:
String Format:

Once the bitmap image is created and displayed on on this page, you can save it by right clicking on it and choosing Save Picture As.

©2002 Professional Touch International, Inc.

This is a dynamic ASP.Net page. It was created at: 2/5/2012 11:08:09 PM