动态报表使用说明

本文章只对折线、柱状和饼形报表进行说明：由于这几种报表只能利用XML文件进行配合使用，所以每个报表都将对应一个xml文件；如果要根据数据库中的数据动态生成报表时，可以根据C#程序动态配置xml文件或者AJAX 异步获取xml格式文本，这里例子就直接写死了。

1.柱形报表Column2D.swf2.柱形报表3D效果对应文件Column3D.swf：3.饼形对应文件.Pie2D.swf4.饼形3D效果对应文件 .Pie3D.swf实现步骤：首先新建一个xml文件如data.xml文件里面配置节点如下：<?xml version="1.0"encoding="gb2312"?><graph caption='每月销售额柱形图'xAxisName='月份'yAxisName= '收入(万元)' showNames= '1'decimalPrecision='0'formatNumberScale='0'>//decimalPrecision为小数点后面的位数formatNumberScale值为1格式化数字如3000自动转为3k，为0时不转换<set name='一月'value='462'color='AFD8F8' /><set name='二月'value='100'color='F6BD0F' /><set name='三月'value='671'color='8BBA00' /><set name='四月'value='494'color='FF8E46 ' /><set name='五月'value='761'color='008E8E' /><set name='六月'value='960'color='D64646' /><set name='七月'value='629'color='8E468E' /><set name='八月'value='622'color='588526' /><set name='九月'value='376'color='B3AA00' /><set name='十月'value='494'color='008ED6' /><set name='十一月'value='761'color='9D080D' /><set name='十二月'value='960'color='A186BE' /></graph>参数说明：所有参数内容包含在<graph></ graph>中encoding最好值为gb2312，否则里面的中文如“月份”可能在网页中出现乱码；Caption为报表名称，xAxisName对于横坐标的标注，yAxisName对于纵坐标的标注，showNames每个月份横坐标的标题的显示状态(0:隐藏、1:显示)set中的name:每个图块的名字，value每个图块的位置值，color每个段的图块颜色；然后新建一个html页面，拖入jquery和FusionCharts包<script src="jquery-1.3.1.js"type="text/javascript"></script><script src="FusionCharts.js"type="text/javascript"></script>脚本写入如下代码：<script type="text/javascript">$(function() {//页面初始化$("#btn").click(function() {var mychar = new FusionCharts("Charts/Column2D.swf", "tuid", "300", "200");//Column2D.swf文件的路径，唯一id标识可任写，报表宽度，高度mychar.setDataURL("Data.xml");//上面已经配置好的xml文件路径 mychar.render("mydiv");//报表要放入的位置这里是一个层的id }); });</script>//异步获取xml格式文本<script type="text/javascript">//使用ajax获取数据，不从xml文件中得到数据，使用setDataXML(返回的xml格式文本);$.get("Handler1.ashx",function(date) {var mychar = new FusionCharts("Charts/Column2D.swf ", "tuid", "500", "300"); mychar.setDataXML(date);mychar.render("handerDiv");});</script>在Handler1.ashx文件中如下代码public void ProcessRequest(HttpContext context){context.Response.ContentType = "text/plain";//设置xml文件字符串//设置全局配置参数string XMLstr = "<?xml version='1.0' encoding='gb2312'?><graph caption='每月销售额柱形图' xAxisName='月份' yAxisName= '收入(万元)' showNames= '1' decimalPrecision='0' formatNumberScale='0'>";//配置详细数据XMLstr += "<set name='一月' value='462' color='AFD8F8' />"+"<set name='二月' value='100' color='F6BD0F' />"+ "<set name='三月' value='671' color='8BBA00' />"+ "<set name='四月' value='494' color='FF8E46 ' />"+ "<set name='五月' value='761' color='008E8E' />"+ "<set name='六月' value='960' color='D64646' />"+ "<set name='七月' value='629' color='8E468E' />"+ "<set name='八月' value='622' color='588526' />"+ "<set name='九月' value='376' color='B3AA00' />"+ "<set name='十月' value='494' color='008ED6' />"+ "<set name='十一月' value='761' color='9D080D' />"+ "<set name='十二月' value='960' color='A186BE' />";XMLstr += "</graph>";//响应流中context.Response.Write(XMLstr);}折线图表对于折线报表图和上面使用方法一样，唯一变化的就是swf文件和xml文件配置；<?xml version="1.0"encoding="gb2312" ?><graph caption='2009-07-28 至2009-07-29 'PYAxisName= 'Revenue'SYAxisName='Quantity' xAxisName='当前地区近两日负荷图'showValues='0'decimalPrecision='0'bgcolor='F3f3f3'bgAlpha= '70'showColumnShadow='0'divlinecolor='c5c5c5'divLineAlpha= '60'showAlternateHGridColor='1' alternateHGridColor= 'f8f8f8'alternateHGridAlpha='60'SYAxisMaxValue= '750'> <categories><category name='0' /><category name='2' /><category name='4' /><category name='6' /><category name='8' /><category name='10' /><category name='12' /><category name='14' /><category name='16' /><category name='18' /><category name='20' /><category name='22' /><category name='' /></categories><dataset seriesName='28日负荷(MW)'color='c4e3f7'parentYAxis='P' ><set value='27400' /><set value='29800' /><set value='25800' /><set value='26800' /><set value='29600' /><set value='32600' /><set value='31800' /><set value='36700' /><set value='29700' /><set value='31900' /><set value='34800' /><set value='24800' /><set value='34800' /></dataset><dataset seriesName='29日负荷(MW)'color='Fad35e'parentYAxis='P' ><set value='10000'/><set value='11500'/><set value='12500'/><set value='15000'/><set value='11000' /><set value='9800' /><set value='11800' /><set value='19700' /><set value='21700' /><set value='21900' /><set value='22900' /><set value='20800' /><set value='22800' /></dataset><dataset seriesName='当日时间点'parentYAxis='S'color='8BBA00'anchorSides='10' anchorRadius='3'anchorBorderColor='009900' ><set value= '0' /><set value= '2' /><set value= '4' /><set value= '6' /><set value= '8' /><set value= '10' /><set value= '12' /><set value= '14' /><set value= '16' /><set value= '18' /><set value= '20' /><set value= '22'/></dataset></graph>。