- 浏览: 132718 次
- 性别:
- 来自: 杭州
文章分类
最新评论
-
522823979:
JXL POI 导出excel 包括图片 -
贝塔ZQ:
实现导出excel文件和图片,感觉用poi和jxl代码量好多, ...
JXL POI 导出excel 包括图片 -
bmpbhg:
和你的类似,不过我这边报的是
org.dom4j.Docume ...
Servlet 接受解析HTTP请求XML数据,返回XML -
Wuaner:
引用Non Field Validators排在前面的先执行 ...
struts2 内建效验器 -
timelion:
请将正式简历发送至
timelion@163.com
找工作中...放上简历,求推荐
[AJava]FusionCharts Free中文开发指南[使用文档教程]第五章--FusionCharts Free使用dataXML加载数据
- 博客分类:
- web
在前面的例子里,我们使用的数据都是一个单独的XML文件,它可以被很多需要它的文件来调用。但是有的时候,我们可能不需要单独的文件,这时,我们就可以使用dataXML 方法来进行数据的调用。
使用dataXML提供数据
dataXML 和dataURL都可以提供数据,dataURL是以把XML文件地址以URL的形式告诉FCF,如一个静态的文件Data.xml,或者是一个动态的文件,如mydata.jsp(页面返回XML格式的文本)。dataXML则是以XML文本的形式告诉FCF。可能有点不好理解,看看下面的代码就知道了。
我们把上面的代码保存到一个叫ChartDataXML.html的文件里。
可以看到,FlashVars 的值是这样的一种形式:
使用JavaScript和dataXML
看下面的代码。
原来我们调用的是setDataURL()方法,而现在是setDataXML()方法,它的参数则是一个完整的XML字符串。
不管我们使用什么方法,我们都能得到一样的结果。
setDataXML()方法的问题
我们知道,在使用GET方法得到参数时,浏览器对参数值的长度是有一定的限制的,所以,如果XML字符过长,可能会产生问题。这时我们就需要使用setDataURL()方法。
如果你的XML字符里含有双字节字符,例如中文字符,你就不能使用setDataXML()方法,你应该使用setDataURL()方法。
最佳模式
在我们的实际应用里,数据不可能是静态的,它可能是有用户选择查询条件,然后提交给服务器,服务器返回一个查询的结果,比如search.jsp?year=2008。所以我给大家推荐的最佳模式是使用setDataURL()方法,并且使用JavaScript来加载图形。
在使用setDataURL()方法时,如果地址里含有“?”、“&”等字符,你就需要对这个地址进行URL编码。在JavaScript里进行编码,使用escape(url)这个函数。如果你想在服务器端就进行编码,那就使用你的编程语言提供的URL编码方法。在java里进行编码的函数是java.net.URLEncoder.encode()。
使用dataXML提供数据
dataXML 和dataURL都可以提供数据,dataURL是以把XML文件地址以URL的形式告诉FCF,如一个静态的文件Data.xml,或者是一个动态的文件,如mydata.jsp(页面返回XML格式的文本)。dataXML则是以XML文本的形式告诉FCF。可能有点不好理解,看看下面的代码就知道了。
<html> <body bgcolor="#ffffff"> <OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="600" height="500" id="Column3D" > <param name="movie" value="../FusionCharts/FCF_Column3D.swf?chartWidth=600&chartHeight=500" /> <param name="FlashVars" value="&dataXML=<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'><set name='Jan' value='462' color='AFD8F8' /><set name='Feb' value='857' color='F6BD0F' /><set name='Mar' value='671' color='8BBA00' /><set name='Apr' value='494' color='FF8E46'/><set name='May' value='761' color='008E8E'/><set name='Jun' value='960' color='D64646'/><set name='Jul' value='629' color='8E468E'/><set name='Aug' value='622' color='588526'/><set name='Sep' value='376' color='B3AA00'/><set name='Oct' value='494' color='008ED6'/><set name='Nov' value='761' color='9D080D'/><set name='Dec' value='960' color='A186BE'/></graph>"> <param name="quality" value="high" /> <embed src="../FusionCharts/FCF_Column3D.swf?chartWidth=600&chartHeight=500" flashVars="&dataXML=<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'><set name='Jan' value='462' color='AFD8F8' /><set name='Feb' value='857' color='F6BD0F' /><set name='Mar' value='671' color='8BBA00' /><set name='Apr' value='494' color='FF8E46'/><set name='May' value='761' color='008E8E'/><set name='Jun' value='960' color='D64646'/><set name='Jul' value='629' color='8E468E'/><set name='Aug' value='622' color='588526'/><set name='Sep' value='376' color='B3AA00'/><set name='Oct' value='494' color='008ED6'/><set name='Nov' value='761' color='9D080D'/><set name='Dec' value='960' color='A186BE'/></graph>" quality="high" width="600" height="500" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object> </body> </html>
我们把上面的代码保存到一个叫ChartDataXML.html的文件里。
可以看到,FlashVars 的值是这样的一种形式:
<PARAM NAME="FlashVars" Value="&dataXML=completeXMLData">在EMBED 标记里,是这样的:
<EMBED ... FlashVars="&dataXML=completeXMLData">而原来我们放到FlashVars的两个参数--chartWidth,chartHeight,则被放到了SWF文件地址的后面。
使用JavaScript和dataXML
看下面的代码。
<html> <head> <script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script> </head> <body bgcolor="#ffffff"> <div id="chartdiv" align="center">The chart will appear within this DIV. This text will be replaced by the chart.</div> <script type="text/javascript"> var myChart = new FusionCharts("../FusionCharts/FCF_Column3D.swf", "myChartId", "600", "500"); myChart.setDataXML("<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'><set name='Jan' value='462' color='AFD8F8' /><set name='Feb' value='857' color='F6BD0F' /><set name='Mar' value='671' color='8BBA00' /><set name='Apr' value='494' color='FF8E46'/><set name='May' value='761' color='008E8E'/><set name='Jun' value='960' color='D64646'/><set name='Jul' value='629' color='8E468E'/><set name='Aug' value='622' color='588526'/><set name='Sep' value='376' color='B3AA00'/><set name='Oct' value='494' color='008ED6'/><set name='Nov' value='761' color='9D080D'/><set name='Dec' value='960' color='A186BE'/></graph>"); myChart.render("chartdiv"); </script> </body> </html>
原来我们调用的是setDataURL()方法,而现在是setDataXML()方法,它的参数则是一个完整的XML字符串。
不管我们使用什么方法,我们都能得到一样的结果。
setDataXML()方法的问题
我们知道,在使用GET方法得到参数时,浏览器对参数值的长度是有一定的限制的,所以,如果XML字符过长,可能会产生问题。这时我们就需要使用setDataURL()方法。
如果你的XML字符里含有双字节字符,例如中文字符,你就不能使用setDataXML()方法,你应该使用setDataURL()方法。
最佳模式
在我们的实际应用里,数据不可能是静态的,它可能是有用户选择查询条件,然后提交给服务器,服务器返回一个查询的结果,比如search.jsp?year=2008。所以我给大家推荐的最佳模式是使用setDataURL()方法,并且使用JavaScript来加载图形。
在使用setDataURL()方法时,如果地址里含有“?”、“&”等字符,你就需要对这个地址进行URL编码。在JavaScript里进行编码,使用escape(url)这个函数。如果你想在服务器端就进行编码,那就使用你的编程语言提供的URL编码方法。在java里进行编码的函数是java.net.URLEncoder.encode()。
发表评论
-
基于wp_poll开发满意度调查
2010-12-03 10:23 1076最近换了公司,试用期给公司改造内部网. 试用wordpress ... -
png图片透明ie6解决
2010-11-17 16:31 903// 图片透明 function setPng(img, ... -
Jquery 应用收集
2010-07-14 09:49 17571.结合时间控件WdatePicker使用,根据radio值不 ... -
原生AJAX 实现级联select
2010-02-22 15:15 4069由于是在客户上的框架上做开发,因为是比较老的框架,ajax框架 ... -
JS知识
2010-02-05 13:19 895JavaScript节点操作DOMDocument属性和方法 ... -
CSS知识
2010-01-07 15:01 757虽然我不是美工,也不专门去学CSS,但是项目中遇到的一些技巧还 ... -
HTML
2009-12-04 14:54 8211.标签map-- 定义图像点击区域的集合 map 标签 m ... -
JS函数收集--001
2009-11-30 09:52 883记录下开发过程中常用到的JS问题 1. 直接获取对性属性, ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第十四章--在JSP里使用FCF
2009-11-25 16:05 2002前面我们讲的例子里,都是采用HTML或JavaScript来显 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第十三章--间断数据的处理
2009-11-25 16:00 1527有时候我们的数据并不是连续的,例如我们有一个反映每个月销售额的 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第十二章--FCF中的特殊字符
2009-11-25 15:52 1639在FCF里,如果要在图形里用到一些特殊的字符,你就要对它进行编 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第十一章--FCF中的基本数字格式
2009-11-25 15:51 1855在我们的报表里,经常要对数值进行一些格式化,如小数位,千分位等 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第十章--FCF中的下钻
2009-11-25 15:46 1507在我们开发图形报表时,你可能会遇到这样的需求:用户要求点击柱状 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第九章--动态改变图形的类型和数据
2009-11-25 15:44 3219在前面的章节里,我们已经了解了图形的基本使用方法以及图形XML ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第八章--FusionCharts Free和组合图XML
2009-11-25 15:42 2911本章我们来看看什么是组合图形,以及它的XML是怎么写的。 什 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第七章--FusionCharts Free和XML
2009-11-25 15:40 2449FusionCharts使用XML来创建和控制图形。 数据类 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第六章--FusionCharts Free图形的基本元素
2009-11-25 15:38 2448在我们了解了FCF的各种使用方法以后,我们就会发现,其实我们要 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第四章--FusionCharts Free使用JavaScript加载图形
2009-11-25 15:32 2164在上篇文章里,我们做 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第三章--FusionCharts Free我的第一个图形
2009-11-25 15:30 2701在介绍完了FCF的下载安装以后,现在,我们终于要开始创建我们的 ... -
[AJava]FusionCharts Free中文开发指南[使用文档教程]第一章--FusionCharts Free介绍
2009-11-25 15:28 2015FusionCharts是InfoSoft Global公司的 ...
相关推荐
FusionCharts Free中文开发指南FusionCharts Free中文开发指南
FusionCharts Free中文开发指南.doc
FusionCharts Free则是FusionCharts提供的一个免费版本,虽然免费,功能依然强大,图形类型依然丰富。 不得不感叹技术发展的真快,99年的时候,flash刚刚在互联网上流行,那时还只是一个简单的动画软件,编程能力...
FusionCharts Free中文开发指南 (完全版)
FusionCharts Free中文开发指南
报表开发工具文档 FusionCharts Free
《FusionCharts Free中文开发指南》
FusionCharts Free中文开发指南第二版
FusionCharts Free 中文 开发 指南
FusionCharts Free flash的报表教程
描述了如何使用FCF,可以满足日常的图形开发需要。FCF的XML参考分为Single Series Charts、Multi-Series Charts、Stacked Charts等等好几部分,但是对于绝大部分应用来说,Single Series Charts就足够了。 Single ...
FusionCharts Free中文开发指南文档 FusionChartsFree