设为首页收藏本站

UNIX技术社区

 找回密码
 注册

QQ登录

只需一步,快速开始

搜索
热搜: console
查看: 4772|回复: 1

FusionCharts自动导出图片方法

[复制链接]
发表于 2010-10-16 00:49:46 | 显示全部楼层 |阅读模式
最近做项目,需要做一个根据模板自动生成各种报表的功能(word格式),模板上待替换的标签包括日期、各类数字、表格、统计图等;

因为项目中的柱状图、折线图什么的都是用FusionCharts做的,为了保持统一,这里也需要用FusionCharts生成图片,然后插入到word中;

做之前在网上搜索了一下,网上有提到FusionCharts生成图片或pdf的方法,但都是通过flash的右键来触发的,不符合自动化的需求;

于是,我自己研究了,现总结如下:

FusionCharts在v3.0.7支持了导出jpeg和png,在v3.1支持了导出pdf,下面是右键菜单的图片


而导出的方式也支持多种(老外写的东西就是好),支持服务器端导出(存到服务器硬盘或输出文件流)、客户端导出、批量导出;

我这里用到的是服务器导出的硬盘的方法,要想使用该方法,需要把xm的chartl修改如下:

  1. exportEnabled='1' exportHandler='test.aspx' exportAtClient='0' exportAction='save'
复制代码

其中exportHandler是指用何种方式处理导出结果,我这里指定的是一个.net的url路径,官方有对应类的下载,包括php,jsp,.net的

这样设置后,就可以点击右键导出了,如下图:



其中进度条的提示效果,都可以自己修改或隐藏;

接下来我要用js来触发右键导出的事件,由于FusionCharts是在swf加载完毕才能导出的,否则导出的图片就不完整了,因此这里要加一个判断,具体代码如下:
==============================
  1. <script type="text/javascript"> function ExportMyChart() { var chartObject = getChartFromId('myChart'); if( chartObject.hasRendered() ) chartObject.exportChart(); }</script>
复制代码
==============================

在导出完图片后,我们还需要得到图片的路径,好把它插入到word中;FusionCharts也同样提供了该回调方法exportCallback,再次调整xml,最终代码如下:


    1. <chart caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showValues='0' decimals='0' formatNumberScale='0' exportEnabled='1' exportShowMenuItem='1' exportAtClient='0' exportHandler='test.aspx' exportAction='save' exportCallback='FC_Exported'>
    复制代码

然后再定义回调方法就ok了,
  1. function FC_Exported(objRtn) {
  2. if (objRtn.statusCode == "1") {
  3. alert(objRtn.fileName);
  4. } else {
  5. alert("生成图表出错: " + objRtn.statusMessage);
  6. }
  7. }
复制代码

==============================

这样基本的功能就实现了,为了实现自动,需要再在页面加一个定时器调用ExportMyChart();
后记:由于word中图片的自动插入过程是不需要给用户看FusionCharts生成的swf的,所以需要把它放一个用户看不到的div里,但是div不能用display:none;因为不可见的元素,是无法调用对应方法的
ty4278 该用户已被删除
发表于 2013-1-21 19:28:39 | 显示全部楼层
请问在么,能把相应的文件发给我看一下么
我的qq:545452304
您需要登录后才可以回帖 登录 | 注册

本版积分规则

快速回复 返回顶部 返回列表