To begin with, let's create a simple chart that will visually depict the Weekly Sales of a fictitious shop. The sample data we intend to plot can be tabularized as shown below:

Let's see how to use FusionCharts ASP Class to plot this data into a column3D chart:

Let's analyze the steps involved in the above code:

• We include FusionCharts_Gen.asp in the program. This file contains FusionCharts ASP Class codes.
  
  

  <!--#include file="../Class/FusionCharts_Gen.asp"-->

  
  
• We create a chart object.
  
  

  set FC = new FusionCharts

  
  
• We specify the chart type.
  
  

  Call FC.setChartType("Column3D")

  
  
• We specify the size of the chart.
  
  

  Call FC.setSize("300","250")

  
  

• Next, we set a relative path to the chart SWF files using the setSwfPath() function. This is the path from which we load the chart SWF files.
  
  

  Call FC.setSWFPath("../FusionCharts/")

  
  
• We store all desired chart attributes in the strParam variable and set chart attributes using the setChartParams() function.
  
  

  strParam="caption=Weekly Sales;xAxisName=Week;yAxisName=Revenue;numberPrefix=$"
  Call FC.setChartParams(strParam);

  
  
• Now, we provide chart data through the addChartData() function.We pass the value first and then the category name against each value as a parameter i.e., label=Week 1 etc.
  
  

  Call FC.addChartData("40800","label=Week 1","")
  Call FC.addChartData("31400","label=Week 2","")
  Call FC.addChartData("26700","label=Week 3","")
  Call FC.addChartData("54400","label=Week 4","")

  NOTE: ASP does not support the concept of optional parameter. Hence, we need to provide all the parameters. In case you have nothing to pass as a parameter to a function, you need to provide a blank ("") value, as we did here for addChartData(). In the coming pages we will follow this rule as well.

• Finally, we include FusionCharts.js - FusionCharts JavaScript Embedding Class.
  
  
• And display the chart using the renderChart() function. Please note False is passed as a parameter to the renderChart() function. This is done to render the chart using JavaScript embedding method. IF you wish to render the chart using HTML embedding method, you will need to pass True instead.
  
  

  Call FC.renderChart(false)

Here is the Column 3D chart that our FusionCharts ASP Class renders:

Please go through FusionCharts ASP Class API Reference section to know more about the functions used in the above code.

When we declare an object of FusionCharts ASP Class, we use initializing functions like setChartType, setSize etc.

In the code above, the statement Call FC.setSize("300","250") sets the chart's width to 300 pixels and height to 250 pixels.

Hence, we can use this to set the desired dimension of our charts. Let's set our chart's dimension to 450 x 350 pixels.

As we discussed above, the chart type is also specified using setChartType function, while declaring FusionCharts ASP Class object.

Call FC.setChartType("Column3D")

Call FC.setChartType("Pie3D") 

To change chart type you can use any of the Chart Type names listed below: