Implementation Methods > Using it with ASP.NET
 
In the previous example, we had seen how to use FusionCharts with ASP. Here, we will learn how to use it with Microsoft's newest web technology - ASP.NET.

Analogically, using FusionCharts with ASP.NET is very similar to using with ASP.NET, but for the changes in data connection and retrieval modules.

As an example, we will consider the case of a company which wants to plot a pie chart showing the various shareholders of the company. The name of the shareholders and the number of shares owned by each of them is stored in two columns of a SQL Server table tbl_shares. So, let's get straight to action and create a page Shares.aspx which would show the graphical distribution of shares. For this example, we will opt to do everything in one page itself, i.e., we would go the dataXML way to provide data to the graph.

Create a new page Shares.aspx and enter the following code in it:

<%@ Page Language="VB" debug="true" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SQLCLient" %>

<Script runat="server">
'Declare a string that will store the complete XML Data
Dim strXML as string
'An array Colors which would be used to determine the color of each pie
Dim Colors(10) as String
'An incremental counter
Dim intCounter as Integer
Sub Page_Load(sender as object, e as eventargs)
intCounter = 0
'Set some colors
Colors(1) = "33FF66"
Colors(2) = "FF6600"
Colors(3) = "3399FF"
Colors(4) = "009966"
Colors(5) = "CC3399"
Colors(6) = "FFCC33"
Colors(7) = "6699CC"
Colors(8) = "CC3366"
Colors(9) = "993366"
Colors(10) = "0033FF"
'Initialize and declare the data connection objects and
Dim objConn as New SQLConnection("Initial Catalog=Flash;Data Source=(local);User ID=sa;")
Dim objCmd as New SQLCommand("select name,Numshares from tbl_Shares", objConn)
Dim objReader as SQLDataReader
'Set the graph attributes
strXML = "<graph bgcolor='ffffff' xaxisname='Name' caption='Shareholders' legendboxbgcolor='FFFFFF' legendboxbrdrcolor='000000' navbtncolor='FF0000'>"
'Open the connection
objConn.Open()
'Execute the reader
objReader = objCmd.ExecuteReader()
'Iterate through each record retrieved from the Database
While objReader.Read()
'Increment the counter
intCounter = intCounter + 1
'Generate the XML for each record
strXML = strXML & "<set name='" & objReader("Name") & "' value='" & objReader("NumShares") & "' color='" & Colors(intCounter) & "'/>"
End While
'Close the reader and the connection
objReader.Close()
objConn.Close()
'Append the closing element
strXML = strXML & "</graph>"
'Finally bind the data
Page.DataBind()
End Sub
</Script>
<HTML>
<HEAD>
<TITLE>
Shareholders
</TITLE>
</HEAD>
<BODY>
<CENTER>
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=5,0,0,0"
WIDTH="565" HEIGHT="420" id="FCPie" ALIGN="">
<PARAM NAME=movie VALUE="../Charts/FC2Pie.swf">
<PARAM NAME=FlashVars VALUE="&dataXML=<%# strXML %>">
<PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="../Charts/FC2Pie.swf" FlashVars="&dataXML=<%= strXML %>" quality=high bgcolor=#FFFFFF WIDTH="565" HEIGHT="420" NAME="FCPie" ALIGN=""
TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>
</CENTER>
</BODY>
</HTML>

And, when you view the above page in browser, you should get a similar output as the one below:
And, so you saw how easily you can integrate FusionCharts with ASP.NET.