FusionCharts 3.2 使用说明 以及 swf
|
FusionCharts 3.2 使用： ??今天（2013-09-14）有时间重新整理一下FusionCharts 3.2 使用，主要是排版简便和操作方便。 ?以前用的是最老版的，不支持导出图片，不支持json数据， ??个人暂时发现新的版本几个好处:?1、支持导出图片 2、json数据格式的支持。 ??下面说下，新版本的用法吧（现在已经不是最新的了最新版本：3.3.1，不过应该通用），留个备份： ?新版本在线预览地址：? ==========================静态页面版本========================== 使用这个版本很简单： 1、从官网下载例子：下载地址：http://www.fusioncharts.com/download/，现在最想的已经是3.3.1版本。 ? ? 但是下载的版本里面显示的flash是有fusionchart的logo的，我想很多朋友主要是想要这个破解的文件， ? ? 很简单，请操作第二步。 2、swf下载：http://download.csdn.net/detail/misswuyang/3600279，这个由于以前的csdn账号的资源区现在无法改成0分了，所以如果没有csnd账号的朋友，可以直接发邮件给我，我会直接把破解的swf发给你，邮箱地址：admin@aiisen.com，收到邮件有我会第一时间回复。 ==========================服务器使用版本========================== ?步骤一： ?从官网下载js文件和swf，地址：http://www.fusioncharts.com/download/ ?存放到项目对应位置： ?步骤二： ?页面编写：
Copy
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>fusionchartV3 测试</title>
</head>
<body>
<script type="text/javascript" src="${ctx}/scripts/fusioncharts/FusionCharts.js"></script>
<h3>fusionchartV3 测试</h3>
<p> </p>
<div id="chartdiv" align="center"> </div>
<script type="text/javascript">
var chart = new FusionCharts("${ctx}/scripts/fusioncharts/swf/MSColumn3D.swf","ChartId","560","400","0","0");
chart.setDataUrlParams("id","61122");
chart.setDataURL("${ctx}/fusioncharts/Index.do?method=MSColumn3DSale");
chart.render("chartdiv");
</script>
<script type="text/javascript" src="${ctx}/commons/scripts/jquery.js"></script>
<script type="text/javascript">//<![CDATA[
//]]></script>
</body>
</html>
步骤三： 后台代码：【部分代码有省略】我这里是用freemarker模块生成xml，实现，部分代码截图：
注意：1、自己写了个方法【setDataUrlParams】，可以往里面传参数? ?? 2、这个当调试的时候，发现每次都会调用2次ajax到后台取数据，研究FusionCharts.debug.js后发现，在1681行的问题，注释后ok！如图：
3、自己改写的js,点击下载：? （链接：http://pan.baidu.com/share/link?shareid=4175037387&uk=959541513密码：ppn0） ?? 步骤四： ?xml文件：我这里是部分写活的：这里已经配置了导出图片的参数： exportEnabled="1"，具体的说明： ? ? ?http://www.fusioncharts.com/docs/???里面的 http://www.fusioncharts.com/docs/ECXML.html
推荐用：exportAtClient="0" 客户端导出?这个模式，速度快，? exportHandler="${((ctx)!' ')?html}/FCExporter.do"， exportHandler是后台导出的方法链接，我的实现 1、servlet里面配置 ：?
Copy
<servlet>
<servlet-name>FCExporter</servlet-name>
<servlet-class>com.fusioncharts.exporter.servlet.FCExporter</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>FCExporter</servlet-name>
<url-pattern>/FCExporter.do</url-pattern>
</servlet-mapping>
2、引入fcexporter.jar和fcexporthandler.jar（下载包中有）,在用的过程中发现自带的jar包虽然图片可以导出，但是部分代码 报错，所以我有重新改写了下代码，打成了一个jar包fusioncharts.jar，点击下载： 链接：http://pan.baidu.com/share/link?shareid=4177185228&uk=959541513 密码：88kh
Copy
<?xml version="1.0" encoding="GBK"?>
<chart exportFileName="${((exportFileName)!' ')?html}" exportEnabled="1" exportAction="download" exportAtClient="0" exportHandler="${((ctx)!' ')?html}/FCExporter.do" caption="Country Comparison" showLabels="1" showvalues="0" decimals="0" numberPrefix="$">
<categories>
<category label="Austria" />
<category label="Brazil" />
<category label="France" />
<category label="Germany" />
<category label="USA" />
</categories>
<dataset seriesName="1996" color="AFD8F8" showValues="0">
<set value="${((id)!' ')?html}" />
<set value="20148.82" />
<set value="17372.76" />
<set value="35407.15" />
<set value="38105.68" />
</dataset>
<dataset seriesName="1997" color="F6BD0F" showValues="0">
<set value="57401.85" />
<set value="41941.19" />
<set value="45263.37" />
<set value="117320.16" />
<set value="114845.27" />
</dataset>
<dataset seriesName="1998" color="8BBA00" showValues="0">
<set value="45000.65" />
<set value="44835.76" />
<set value="18722.18" />
<set value="77557.31" />
<set value="92633.68" />
</dataset>
</chart>
步骤五： 启动服务器，输入地址：如图
步骤六： 下载破解版的swf，这样生成的flash里面就没有了fusionChart的logo了 下载地址：http://download.csdn.net/detail/misswuyang/3600279 如果没有csdn分，可以发邮件给我，我会直接通过邮件发给你，邮箱 admin@aiisen.com 好消息,现在提供在线下载地址： ?（链接：http://pan.baidu.com/share/link?shareid=4155649333&uk=959541513 密码：bqcp） 如果觉得不错记得分享下！~ 特别说明：为了有更好的兼容性（在mac下也能显示）， 推荐使用：百度的echarts，兼容到IE8！ 下载地址：http://echarts.baidu.com/ （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
