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

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

初识FusionCharts free

FusionCharts free 是一个跨平台,跨浏览器的flash图表组件解决方案,可以用来制作数据动画图表,其中动画效果用的是Adobe Flash 8 (原Macromedia Flash的)制作的flash FusionCharts可用于任何网页的脚本语言,类似于HTML .NETASP 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/

 

 

你可能感兴趣的:(free,FusionCharts,Flash图表,java图表,折线flash)