Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Here is a HelloWorld sample on the new ASP.NET Charting control.

To begin with, install the free Microsoft Chart Controls and the "Tools for VS 2008 for Chart Controls" from here and here

Note that if you don’t install the Tools for VS 2008 for Chart controls, the Chart Server Control doesnt show up in the Toolbox

Once you are done with the installation, restart Visual Studio if you are already running the same (of course, save your work)

1. Start Visual Studio 2008 and create a File – New – ASP.NET Website or a Web Application

2. From the ToolBox, under Data tab, pick up the “Chart” control (the icon would be a series of colored bar graphs) and drag and drop it into the page.

3. Click on the smart tag for configuring the Chart control and Choose DataSource

4. Select “Database” and provide the connection string to your database server (in my case I chose Northwind)

5. Choose to save the connection string etc., and select the Database table (in my case I chose “Category Sales for 1997”)

6. Click “Finish” to complete the process.

7. Now if you run the page you will NOT get the Chart Control.

8. You need to select the Properties of the Chart Control from design view.

9. Make sure under “Data” DataSource is set to “SqlDataSource1” unless you gave a different name and DataMember is set to “DefaultView”

10. Under “Series” in Properties, click on the tab to open up the “Series Collection Editor”.

11. Scroll down the Series1 Properties to DataSource section.

12. Specify “CategoryName” as the XValueMember and “CategorySales” for YValueMembers and click Ok.

13. Build the page and hit F5 to run the page.

14. You will be able to see the Chart in your webpage.

15. Right Click on the chart and you would be able to see that it is an image generated dynamically that can be saved as a “.png” file.

You can download a comprehensive list of samples from here and verify the different implementations and source code for the same.   For more details, visit the forums here

Cheers !!!

posted @ Monday, December 01, 2008 6:36 PM

Print

Comments on this entry:

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Thanigainathan.S at 12/1/2008 11:42 PM
Gravatar
Hi,

I have a Excel datasource. Whats the procedures to display the graph for that using chart controls.

Thanks,
Thani

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Jeny Young at 12/2/2008 8:11 AM
Gravatar
Thanks for the sample application

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by siddu at 12/2/2008 7:10 PM
Gravatar

Hi thanks for giving the toolbox

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by OM at 12/3/2008 1:19 AM
Gravatar
nice and short. thanks....

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Kishore T at 12/4/2008 6:40 PM
Gravatar
I want to change the line width of a Line chart. How can i do this?

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by brad at 12/5/2008 8:42 AM
Gravatar
another nice article: http://brad.w3portals.com/2008/12/c-howto-create-quick-pie-chart-with-new.html

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Saran at 12/9/2008 12:42 PM
Gravatar
It's fine. Crisp and able to follow easily.

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Charting in ASP.NET, ASP.NET Cha at 12/18/2008 1:57 AM
Gravatar
Hi,
I installed .NET framework 3.5 service pack1 and free Microsoft Chart Controls on my local system. I could develop some charts also but when I deploy that on to the server It does not work it gives an error saying "unknown sever tag asp chart".My Sever also have windows 2003 service pack 2, .NET framework 3.5 service pack1 and free Microsoft Chart Controls. I observed that my web.config file on local system has at some tags(like controls , httphandlers, assemblies) about charts which are missing on server web.config. I made same changes to my server web.config file but nothing worked. Any help is appreciated Thanks in advance.

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by asp.net example at 1/3/2009 8:39 PM
Gravatar
Nice blog...

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Anders Bratland at 1/24/2009 4:29 AM
Gravatar
Hi!
Nice Walk-trough! I tried to use the chart control with Windows Azure SDK, and got Out of memory error. When I run it outside Developement Fabrik, it works thogh... Have you tried it with Azure SDK?

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Cybertech.tutor at 1/29/2009 5:08 PM
Gravatar
Step by step method to add control in to toolbox

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Nisarg shah at 2/15/2009 1:21 AM
Gravatar
hi.....
thanks a billians for mentioning about the microsoft chart control and also how to use it...
it will help me a lot....
thanks..keep going..

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by PindaKaas at 4/14/2009 5:42 PM
Gravatar
If you want to render a thicker line you want to set the borderWidth from the series to more than '1'. Series (even with line style) don't have a line width.

Set the borderwidth like so if you want to do it in C#:

Chart1.Series["Series1"].BorderWidth = 3;

Good luck...

# re: Charting in ASP.NET, ASP.NET Chart Controls for .NET 3.5 SP1

Left by Dhruv M. Patel at 4/29/2009 12:14 PM
Gravatar
Hello there!

Great article.

I was searching so long for an article that could explain me to bind multiple series to single chartarea. Your article truly solved my problem.

Thanks again

Your comment:



 (will not be displayed)


 
 
 
 

Live Comment Preview:

 
«July»
SunMonTueWedThuFriSat
2829301234
567891011
12131415161718
19202122232425
2627282930311
2345678