`
心杀心
  • 浏览: 30922 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

FusionCharts free -flash图表组件在java中使用

    博客分类：
  • JAVA
fusionCharts freeflash图表java图表折线flash
阅读更多

针对项目中图表显示，在JFreeChart使用一段时间后，针对图表显示效果来看，flash图表流体美丽，视觉性好，界面友好性更强一些，因此在一些flash组件中选择，最后尝试使用FusionCharts free，作为项目插件。

初识FusionCharts free

FusionCharts free 是一个跨平台，跨浏览器的flash图表组件解决方案，可以用来制作数据动画图表，其中动画效果用的是Adobe Flash 8 （原Macromedia Flash的）制作的flash ，FusionCharts可用于任何网页的脚本语言，类似于HTML ， .NET，ASP ， JSP技术的， PHP ， ColdFusion等，提供互动性和强大的图表。使用XML作为其数据接口，这些XML文件是用虚拟方式生成和传递到FusionCharts， FusionCharts充分利用流体美丽的Flash创建紧凑，互动性和视觉逮捕图表。而且FusionCharts将图表与AJAX应用程序或JavaScript模块，可以随时更新海图在客户端，调用JavaScript函数的热点链接，或要求作出动态XML数据到服务器不涉及任何页面刷新。

FusionCharts Free优点如下:

　　1.动画可交互的图表

　　2.简单但强大的Javascript集成

　　3.无需安装

　　4.简单易用

　　5.与服务器端语言独立（或说无关）

　　6.减少服务器端负荷

　　7.多种图表类型支持

　　8.完全免费(注明：FusionCharts free 为免费版本，另外Funsion还有收费商用版本，两者区别显示在文章最后。)

其中易于使用可体现在下面两方面：

在服务器端，使用FusionCharts ，不必安装任何在服务器上。需要做的只是复制粘贴的SWF文件（核心文件FusionCharts ）到服务器！

在客户端：可以运行在任何服务器和反对任何脚本语言，查看图表，用户只需要安装Adobe Flash Player 8。

 

FusionCharts大概的执行流程：

       1.我们先从数据库取数据；

       2.用代码做一个生成xml的函数，把数据生成xml；

       3.用一段js读取xml，送到FusionCharts，生成统计图表。

 

FusionCharts在java中应用，具体为折线图：

(具体环境，java中使用structs1框架，将22个swf图表模板文件放在目录<%=path%>/js/flashChart/Charts下，将/FusionCharts.js放在目录<%=path%>/js/flashChart)

 

public ActionForward Test(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception {

 

StringBuffer strXml = new StringBuffer();  

       strXml.append("<graph baseFont='SunSim' baseFontSize='12' caption='" +   

               "折线图" +"' subcaption='" + "" + "' " +  

               "yAxisMinValue='" + (-maxValue) + "' yAxisMaxValue='" + maxValue + "' " +  

               "xAxisName='" + "年份" + "' yAxisName='" + "数字" + "' hovercapbg='FFECAA' " +  

               "hovercapborder='F47E00' formatNumberScale='0' decimalPrecision='" + 2 + "' " +  

               "showValues='" + 1 + "' numdivlines='10' numVdivlines='0' " +  

               "showNames='" + 1 + "' rotateNames='" + 1 + "' " +  

               "rotateYAxisName='0' showAlternateHGridColor='1'>");  

      //填数 name-x值，value-y值，hoverText为鼠标放上去显示内容

         for (int i=10;i>-1;i--) {  

           strXml.append("<set name='" + (2013-i) + "' value='" + i + "' hoverText='x,y,"+(analysis_year_int-i)+"' color='AFD8F8' />");  

       } 

       }  

       strXml.append("</graph>");  

       String str =  strXml.toString();  

       request.setAttribute("str", str);

return mapping.findForward("success");

}

 

对应的jsp页面：先引用FusionCharts.js

 

<%@ page language="java" contentType="text/html; charset=UTF-8"%>

 

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>

<head>

<title>hello chart</title>

<script language="JavaScript" src='<%=path%>/js/flashChart/FusionCharts.js '></script>

 

</head>

<body>

<form >

<div id="chartdiv" align="center">

<script type="text/javascript">

var chart = new FusionCharts('<%=path%>/js/flashChart/Charts/FCF_Line.swf', "ChartId", "600", "400");  

    chart.setDataXML("${str}");   

    chart.render('chartdiv');                          

</script> 

</div>

</form>

</body>

</html>

 

 

最后

fusionCharts free和fusionCharts正式版之间的区别

1. 能绘制的图形种类不同。 free支持22种 而正式版是很多。

2. free不支持图片导出。

3. 正式版和free版使用的标签不一样，正式版使用<chart></chart>或<graph></graph>，而free版使用<graph></graph>，功能更局限，chart标签很多功能不能用在graph中。

参考资料：

free和正式版区别：http://www.fusioncharts.com/goodies/fusioncharts-free/compare/

fusionCharts free下载：http://www.fusioncharts.com/goodies/fusioncharts-free/

 

 
  • 大小: 11.4 KB
分享到：
| MyEclipse使用问题
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics