FusionCharts ASP Class建立圖表

FusionCharts可與ASP一同使用以繪製動態數據驅動圖表。使用FusionCharts ASP Class來渲染圖表變得更加容易。接下來,咱們一塊兒來看看如何使用FusionCharts ASP Class功能並建立圖表。javascript

注意:本文中所討論的代碼都包含在Download Package > Code > ASPClass > BasicExample文件夾中。java

建立簡單圖表ui

接下來,咱們建立第一個圖表。在本示例中,咱們將建立一個 "Monthly Unit Sales"圖表。this

運行代碼,將會出現如圖所示的圖表效果:3d

建立一個帶有外部XML文件的圖表orm

如今,咱們將以另一種方式建立相同的圖表。此時,咱們將使用兩個不一樣的程序。一個程序利用FusionCharts ASP Class建立圖表XML,另一個程序藉助於Data URL方法利用該XML來渲染圖表。 Data.asp 文件中的代碼可建立XML,而 SimpleChart.asp文件利用XML渲染圖表。xml

Data.asp文件中的代碼相似於上例中的代碼,惟一不一樣的是,它不渲染代碼,而是將XML流向SimpleChart.asp文件。ip

<%@LANGUAGE="VBSCRIPT"%>
 <% option explicit %>
 <%
 'We have included ../../Includes/FusionCharts_Gen.asp - FusionCharts ASP Class
 'to help us easily embed the charts.
 %>
 <!--#include file="../../Includes/FusionCharts_Gen.asp"-->
 <%
 'This page demonstrates the ease of generating charts using FusionCharts ASPClass.
 'We created a FusionCharts object instance
 'Set chart values and configurations and returns the XML using getXML() function
 'and write it to the response stream to build the XML
 'Here, we have kept this example very simple.
 dim FC
 ' Create FusionCharts ASP class object
 set FC = new FusionCharts
 ' Set chart type to column 3d
 call FC.setChartType("column3D")
 dim strParam
 ' Define chart attributes
 strParam="caption=Monthly Unit Sales;xAxisName=Month;yAxisName=Units;decimals=0; formatNumberScale=0;showLabels=1"
 ' Set chart attributes
 call FC.setChartParams(strParam)
 ' Add chart data values and category names
 call FC.addChartData("462","label=Jan","")
 call FC.addChartData("857","label=Feb","")
 call FC.addChartData("671","label=Mar","")
 call FC.addChartData("494","label=Apr","")
 call FC.addChartData("761","label=May","")
 call FC.addChartData("960","label=Jun","")
 call FC.addChartData("629","label=Jul","")
 call FC.addChartData("622","label=Aug","")
 call FC.addChartData("376","label=Sep","")
 call FC.addChartData("494","label=Oct","")
 call FC.addChartData("761","label=Nov","")
 call FC.addChartData("960","label=Dec","")
 'set content type as XML
 Response.ContentType ="text/xml"
 'Return the chart XML for Column 3D Chart
 Response.Write(FC.getXML())
 %>
ci

接下來,咱們一塊兒來看看SimpleChart.asp功能:get

輸出結果和上例相同:

使用JavaScript渲染器建立簡單圖表:

FusionCharts容許你建立純JavaScript圖表,無需Flash。針對上述代碼並作相應修改後,可實現上述相同的圖表,代碼片斷以下:

' Create FusionCharts ASP class object
 set FC = new FusionCharts
 ' Set chart type to column 3d
 call FC.setChartType( "column3D" )
 ' Set JavaScript renderer
 FC.setRenderer( "javascript" )

...

相關文章
相關標籤/搜索