专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > 图形/图像

FusionCharts使用教程:图表导出替图像/PDF

发布时间:2011-06-27 19:41:18 文章来源:www.iduyao.cn 采编人员:星星草
FusionCharts使用教程:图表导出为图像/PDF

FusionCharts XT图表控件包中的所有图表都可以通过配置而导出为图像/PDF。FusionCharts图表的导出可以在客户端或服务器端进行,所有导出的图像/ PDF可以被保存在客户端或服务器上。

下列图像展示了如何在客户端通过图表的上下文菜单将图像导出为图表。其实,你也可以通过JavaScript APIs导出图表。默认情况下,菜单项目不会出现在FusionCharts图表中,你需要配置导出选项和处理器。本文中,我们将简要介绍所有的导出选项。

FusionCharts XT不能直接将图表导出为图像,它需要借助于服务器端脚本或其他客户端Flash动画(Flash Player 10)。 FusionCharts XT将图表的快照发送至对象FusionCharts Export Handlers,然后将其转换为图像或PDF。

FusionCharts Export Handlers导出处理器有两种形式:Server-side Handlers和Client-side Handler。

FusionCharts Server-side Export Handlers:

服务器端导出处理器通过脚本可帮助你将FusionCharts XT导出为图像/PDF。FusionCharts提供现成的ASP.NET、PHP、Ruby on Rails和Java脚本。

这些脚本接受来自 FusionCharts XT的压缩位图数据(通过HTTP或HTTPS),并转换成相同的图像/PDF。转换后,您有两种选择:

  1. 将输出的(图像/ PDF)保存至服务器磁盘。
  2. 或者,返回至浏览器,让用户立即下载它。

备注:自 FusionCharts XT v3.3.0起,JavaScript 图表可以导出并保存至服务器磁盘。要做到这一点,你需要配置自己的服务器。服务器需要支持PHP和Java(1.3或以上)版本。此外,你需要在服务器上 安装 FusionCharts PHP导出处理器和Apache Batik SVG Rasterizer库。

Client-side Export Handlers:

客户端FusionCharts导出控件,帮助你绕过所有服务器脚本并在客户端将图表保存为图像/ PDF文件。客户端的导出是通过 FusionCharts Export Component SWF文件(需要Flash Player 10)和FusionCharts Export Javascript类来完成的。

FusionCharts图表批量导出

只需单击,你就可以通过客户端导出处理器导出所有网页中的图表。这就是所谓的批量导出。每个图表的导出文件既可以单独保存也可以将所有图表作为一个文件保存。

图表导出设置

要启用图表的导出功能,你需要在图表数据(XML/ JSON)中添加导出设置。你需要设置exportEnabled XML图表属性或者设置JSON图表属性为"1"。

如何设置图表数据导出?

XML

<chart exportEnabled='1' exportAtClient='0' exportHandler='index.php'
yAxisName='Sales Figure' caption='Top 5 Sales Person' numberPrefix='$'>
<set label='Alex' value='25000' />
<set label='Mark' value='35000' />
<set label='David' value='42300' />
<set label='Graham' value='35300' />
<set label='John' value='31300' />
</chart>

 JSON

{
"chart":{
"exportenabled":"1",
"exportatclient":"0",
"exporthandler":"index.php",
"yaxisname":"Sales Figure",
"caption":"Top 5 Sales Person",
"numberprefix":"$"
},
"data":[
{ "label":"Alex", "value":"25000" },
{ "label":"Mark", "value":"35000" },
{ "label":"David", "value":"42300" },
{ "label":"Graham", "value":"35300" },
{ "label":"John", "value":"31300" }
]
}

 

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

热门推荐: