http://tomieric.wordpress.com/2009/12/17/fusionchartfree_about_aspversion/
原来yo2.cn文章被墙了。
fusionchartsFusionChartsFree作为FusionCharts免费版。
唯一缺点是在y轴上不支持中文显示。
FusionChart支持当今流行的各种web语言,如asp,jsp,php,ruby on rails等。
由于工作需要,找了大量的图表插件,但有许多不支持中文显示。选择了asp,因为自己项目是asp。
类似的有许多图表都是采取flash读取xml来实现的,之前也意识到,但js和flash不是很懂。
FusionChartsFree asp精简版主要由两个文件构成。自己翻译了中文注释。
<!--r />--> '
02 '页面: FusionCharts.asp
03 '作者: InfoSoft Global (P) Ltd.
04 '@中文注释 By tomieric
05 '</div>
06 <div>'本页包含一个可以返回FusionCharts的函数</div>
07 <div>'encodeDataURL函数通过dataURL传送参数到FusionCharts中。
08 '如果您的dataURL参数已经有参数值,记住一定要进行编码。
09 '参数: strDataURL - dataURL必须传送图表数据(chart data)
10 '参数: addNoCacheStr - 是否添加其它的URL字符串的数据禁用缓存。
11 Function encodeDataURL(strDataURL, addNoCacheStr)
12 '如果需要可以添加无必要字符串缓存
13 if addNoCacheStr=true then
14 '我们添加 ?FCCurrTime=xxyyzz
15 '如果dataURL已经包含一个a ?, 我们添加 &FCCurrTime=xxyyzz
16 '我们要替换"_", 因为 FusionCharts在URLs不能使用包含此字符
17 if Instr(strDataURL,"?")0 then
18 strDataURL = strDataURL & "&FCCurrTime=" & Replace(Now(),":","_")
19 else
20 strDataURL = strDataURL & "?FCCurrTime=" & Replace(Now(),":","_")
21 end if
22 end if
23 ' 将URL进行编码
24 encodeDataURL = Server.URLEncode(strDataURL)
25 End Function</div>
26 <div>'renderChart函数是通过JavaScript + HTML代码需要嵌入一个图表。
27 '假如在您的网页此函数已经包括了FusionCharts JS类</div>
28 <div>' chartSWF - 图表的显示主要通过的SWF文件名 (和路径)
29 ' strURL - 如果您打算使用dataURL方法显示图表, 就通过URL传送swf文件路径. 否则,将其设置为“”(在dataXML方法的情况下)
30 ' strXML - 如果您打算使用dataXML方法显示图表, 就利用xml来传送数据.否则,设置为 "" (在 dataURL 的情况下)
31 ' chartId - 图表的DIV的ID值, 用于图表在html页面中显示的位置. 每个图表在html页面中必须使用一个ID.
32 ' chartWidth - 图表显示宽度
33 ' chartHeight -图表显示高度 (像素)</div>
34 <div>Function renderChart(chartSWF, strURL, strXML, chartId, chartWidth, chartHeight)
35 '首先我们要为图表写一个div. 一般设置div的id为"chartId"Div.
36 'DIV的名称是区分大小写.
37 -->
38 <!-- 图表脚本块从 开始 -->
39 <div id="<%=chartId%>Div">Chart.图表加载中...
40 <!--r />--> '"Chart.图表加载中..."在图表未加载完成前显示,(可以加入进度条图片等。)
41 '(如果服务器中的swf文件加载滞后). "Chart.图表加载中..."文本也会显示给用户
42 '没有安装Flash Player.你可以配置它按你的需要(写一个在线安装Flash Player或提示下载url).
43 --></div>
44 <!--r />--> '现在,我们使用FusionCharts图表类。每个被命名为chart_“chartId”的ID创建图表的实例。
45 -->
46 <!--
47 //实例图,主要利用js读取xml中的数据
48 var chart_ = new FusionCharts("", "", "", "");
49
50 //设置图表chart的dataURL值
51 chart_.setDataURL("");
52
53 //提供完整的XML数据使用dataXML方法
54 chart_.setDataXML("");
55
56 //最后反馈到chart图表中(指传送xml数据到swf中,flash文件可以通过xml交换数据。)
57 chart_.render("Div");
58 // -->
59 <!-- 图表脚本块从 结束 -->
60 <!--r />--> End Function</div>
61 <div>'renderChartHTML函数利用JavaScript转换它成html代码.
62 '此方法不使用图表嵌入JavaScript类.
63 '相反,它使用直接的HTML嵌入。
64 '所以,如果你看到的IE 6的图表(或以上),您会看到在图表上看到“点击激活...”信息。</div>
65 <div>' chartSWF - 图表的显示主要通过的SWF文件名 (和路径)
66 ' strURL - 如果您打算使用dataURL方法显示图表, 就通过URL传送swf文件路径. 否则,将其设置为“”(在dataXML方法的情况下)
67 ' strXML - 如果您打算使用dataXML方法显示图表, 就利用xml来传送数据.否则,设置为 "" (在 dataURL 的情况下)
68 ' chartId - 图表的DIV的ID值, 用于图表在html页面中显示的位置. 每个图表在html页面中必须使用一个ID.
69 ' chartWidth - 图表显示宽度
70 ' chartHeight -图表显示高度 (像素)</div>
71 <div>Function renderChartHTML(chartSWF, strURL, strXML, chartId, chartWidth, chartHeight)
72 'Generate the FlashVars string based on whether dataURL has been provided
73 'or dataXML.
74 Dim strFlashVars
75 if strXML="" then
76 'DataURL方法
77 strFlashVars = "&chartWidth=" & chartWidth & "&chartHeight=" & chartHeight & "&dataURL=" & strURL
78 else
79 'DataXML方法
80 strFlashVars = "&chartWidth=" & chartWidth & "&chartHeight=" & chartHeight & "&dataXML=" & strXML
81 end if
82 -->
83 <!-- 图表脚本块 开始 -->
84 <div></div>
<%
'----------------------------------------------------------------------------------
'页面: FC_Colors.asp
'作者: InfoSoft Global (P) Ltd.
'@中文注释 By tomieric
'----------------------------------------------------------------------------------
' 本页面包含一个设置FusionCharts的颜色数组
'是一个包含的颜色的十六进制代码数组
' 颜色全部使用十六进制表示
Dim arr_FCColors(20), FC_ColorCounter
'我们先定义一个变量数组,让它能够循环取出参数值
'颜色代码数组.
FC_ColorCounter=0
arr_FCColors(0) = "1941A5" '深蓝色
arr_FCColors(1) = "AFD8F8"
arr_FCColors(2) = "F6BD0F"
arr_FCColors(3) = "8BBA00"
arr_FCColors(4) = "A66EDD"
arr_FCColors(5) = "F984A1"
arr_FCColors(6) = "CCCC00" '铬黄+绿
arr_FCColors(7) = "999999" '灰色
arr_FCColors(8) = "0099CC" '蓝影
arr_FCColors(9) = "FF0000" '亮红色
arr_FCColors(10) = "006F00" '深绿色
arr_FCColors(11) = "0099FF" '蓝色 (淡)
arr_FCColors(12) = "FF66CC" '深粉色
arr_FCColors(13) = "669966" '绿色
arr_FCColors(14) = "7C7CB4" '紫蓝色带阴影
arr_FCColors(15) = "FF9933" '橘色
arr_FCColors(16) = "9900FF" '紫蓝
arr_FCColors(17) = "99FFCC" '蓝色+淡绿
arr_FCColors(18) = "CCCCFF" '浅紫蓝
arr_FCColors(19) = "669900" '绿色带阴影
'getFCColor方法能够返回arr_FCColors数值的一个颜色代码值.
'它能循环迭代返回一个颜色代码的索引值。
'这个索引值是包含在FC_ColorCounter里的。
Function getFCColor()
'更新颜色代码值
FC_ColorCounter = FC_ColorCounter + 1
'返回一个颜色代码值
getFCColor = arr_FCColors(FC_ColorCounter mod Ubound(arr_FCColors))
End function
%>