<%@LANGUAGE="VBSCRIPT"%>
<%
%>
<!--#include file="../Class/FusionCharts_Gen.asp"-->
<%
dim FC
set FC = new FusionCharts
Call FC.setChartType("MSColumn3D")
Call FC.setSize("450","350")
call FC.setSWFPath("../FusionCharts/")
dim strParam
strParam="caption=Weekly Sales;subcaption=Comparison;xAxisName=Week;yAxisName=Revenue;numberPrefix=$"
call FC.setChartParams(strParam)
call FC.addCategory("Week 1", "", "")
call FC.addCategory("Week 2", "", "")
call FC.addCategory("Week 3", "", "")
call FC.addCategory("Week 4", "", "")
call FC.addDataset("This Month", "")
call FC.addChartData("40800", "", "")
call FC.addChartData("31400", "", "")
call FC.addChartData("26700", "", "")
call FC.addChartData("54400", "", "")
call FC.addDataset("Previous Month", "")
call FC.addChartData("38300", "", "")
call FC.addChartData("28400", "", "")
call FC.addChartData("15700", "", "")
call FC.addChartData("48100", "", "")
%>
<html>
<head>
<title>Multi-series Chart : Using FusionCharts ASP Class</title>
<script language='javascript' src='../FusionCharts/FusionCharts.js'></script>
</head>
<body>
<%
call FC.renderChart(false)
%>
</body>
</html>
|
As you can see in the above code, we're doing the following:
- We include FusionCharts_Gen.asp.
- We create an object for Multi-series Column3D chart and set relative file path to the SWF file.
set FC = new FusionCharts
Call FC.setChartType("MSColumn3D")
Call FC.setChartSize("450","350")
Call FC.setSWFPath("../FusionCharts/")
- We store chart attributes in strParam variable and pass it to setChartParams() function. It sets chart attributes.
- For multi-series charts, we need to add the category names separately using addCategory() function.
Call FC.addCategory("Week 1","","")
Call FC.addCategory("Week 2","","")
Call FC.addCategory("Week 3","","")
Call FC.addCategory("Week 4","","")
- Now, we need to define the first dataset. Hence, we call addDataset() function. We set the dataset's name as 'This Month'.
Call FC.addDataset("This Month")
- We provide chart data specific to the above dataset. Remember to provide chart data just after the dataset is defined. Unlike single series charts (as we saw in the First Chart example), we need not specify other chart parameters here.
Call FC.addChartData("40800","","")
Call FC.addChartData("31400","","")
Call FC.addChartData("26700","","")
Call FC.addChartData("54400","","")
Please note that as we have 4 categories, we have entered 4 values for the dataset 'This Month'.
- Next, we create the second dataset for 'Previous Month' and provide its data values.
Call FC.addDataset("Previous Month")
Call FC.addChartData("38300","","")
Call FC.addChartData("28400","","")
Call FC.addChartData("15700","","")
Call FC.addChartData("48100","","")
- We add FusionCharts.js.
- Finally, we render the chart.
Call FC.renderChart(false)
|