首先阐明为何是伪ssh2框架,因为这是公司的一个项目,集成了Struts2和spring3,并没有涉及到到hibernate的使用,所以暂且称它为伪SSH2框架,应为在真正的SSH2框架中使用open flash chart2的技术和在此框架是一样的。废话有点多啊、、、
先概括下什么是open flash chart2,open flash chart 是一个用来生成flash图标的组件,2当然就是第二个版本了,目前最新版本是2.0。使用该组件可以轻松的在web 前端绘制出令人激动的flash伪动态图表(怎么都是伪的?这里指的伪是图表示可以动的,flash就可以动的啦,废话嘛),其实open flash chart是可以绘制出真正的动态图表的,动态请求新数据。
在ssh框架要集成open flash chart2需要去官网下载open flash chart2的组件包,官网地址:
http://openflashchart.com/
![图片](https://i-blog.csdnimg.cn/blog_migrate/0e633b6d27c1c2ccb9cbfde8e4dd7e8b.png)
在DOWNDOWNS标签页里选择这个包下载:
![图片](https://i-blog.csdnimg.cn/blog_migrate/e7951e2d54a2a2e45aabda57d5aced79.png)
这是一个包含demo的完整包,下载下来备用。
下载后解压缩,看到文件夹里有好多东西啊、、、兴奋时刻开始啦、、
![图片](https://i-blog.csdnimg.cn/blog_migrate/802d71b6eb699c5ab69d4f7bd834a1af.png)
痛苦的学习经历就此开始了,谁让你那么想成为牛逼人物呢,就从简单的开始学吧、、、
data-files里有很多html和txt文件 ,html源码中就调用了这些txt文件作为数据来源,在此,我们明确了一点,txt文件时可以作为open flash chart的数据源的,这一点很重要,在之后遇到问题debug时会有用处。
【最重要的上场啦】文件夹根目录里有2个文件,
open flash chart.swf,和
swfobject.js,从文件名上就可以看出前者是生成flash用的工具文件,后者是需要用到的javascript文件。
这时候我们就会想到,既然open flash chart是一个组件,那么想要让java支持这个组件我们似乎还需要做点什么吧,第一个想到的必然是添加必要jar包,ssh框架使用open flash chart 必须要添加2个相关jar包,这在网上可以下载到xstream-1.3.1.jar和jofc-jofc2.jar,下载好这2个jar包后把它们加入到工程的classpath中去,这事我们想起了刚才文件夹里的2个文件open flash chart.swf,和swfobject.js,这2个文件怎么用?在看过官方demo后,我们知道,我们应该把这2个文件归档到工程中,在WebContent新建个目录,名字随便,我这里取名为ShapeReport,把这2个文件拷贝到这个文件夹下,这时候我们的开发环境是不是基本集成好了呢?我们先来看下官方demo中的html
其中有一段是这样的
<script type="text/javascript">
swfobject.embedSWF("open-flash-chart.swf",
"my_chart", "1024", "500", "9.0.0","expressInstall.swf",
{"data-file":"data.txt"});
</script>
data-file肯定是接受数据的,数据源是一个txt文件,我们看一下txt文件的内容大概是这样的:
{
"title":{
"text": "Many data lines",
"style": "{font-size: 20px; color:#0000ff; font-family: Verdana; text-align: center;}"
},
"y_legend":{
"text": "Open Flash Chart",
"style": "{color: #736AFF; font-size: 12px;}"
},
"elements":[
{
"type": "bar",
"alpha": 0.5,
"colour": "#9933CC",
"text": "Page views",
"font-size": 10,
"values" : [9,6,7,9,5,7,6,9,7]
},
{
"type": "bar",
"alpha": 0.5,
"colour": "#CC9933",
"text": "Page views 2",
"font-size": 10,
"values" : [4,9,6,7,9,5,7,6,9]
}
],
"x_axis":{
"stroke":1,
"tick_height":10,
"colour":"#d000d0",
"grid_colour":"#00ff00",
"labels": ["January","February","March","April","May","June","July","August","Spetember"]
},
"y_axis":{
"stroke": 4,
"tick_length": 3,
"colour": "#d000d0",
"grid_colour": "#00ff00",
"offset": 0,
"max": 20
}
/* &x_axis_steps=2& */
}
一看这个文件内容是不是很有亲切感,没错,这就是
json数据嘛,好了,问题出来了,我们如何把我们的数据组装成这个格式的数据呢?这时是不是想到了我们刚刚从网上下载的2个jar包,没错,着个jar用来生成图表对象,例如PieChart(饼图),LineChart(线图),BarChart(柱状图),这些对象的模型都包含在jar包内了,我们可以直接来生成一个对象,然后给改对象设置属性,是不是就生成一个图了?答案是肯定的!!现在的问题是,虽然我们生成了图的数据,但前台data-file接受的是json数据,我们怎么样把这些对象生成json数据传回前台供解析呢?这时我们就会想到SSH的struts框架了,它不是可以按照规定的要求返回到前台合适的数据类型吗?我们公司的工程在这个环节上废了我九牛二虎之力啊,我在struts.xml中配置了返回json类型,我一开始的代码大概是这样的:
下载json包加入classpath,
<
action
name
="testAction"
class
="com.json.action.TestAction"
method
="testMethod"
>
<
interceptor-ref
name
="json"
/>
<!--
处理以JSON文本提交的请求
-->
< result type ="json" /> <!-- 将action的bean属性以json字符串返回浏览器 -->
</ action >
这样配置了之后,我发现前台始终无法解析我传回的json数据,后来发现与我们项目的系统框架有冲突,那怎么办呢?算了,自己动手丰衣足食,自己写返回类型。
写了个返回类型的类:
OFC2Result.javaimport java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
import jofc2.model.Chart;
import org.apache.struts2.StrutsStatics;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionInvocation;
import com.opensymphony.xwork2.Result;
import com.opensymphony.xwork2.util.ValueStack;
public class OFC2Result implements Result {
private static final long serialVersionUID = 6881760833309063964L;
@Override
public void execute(ActionInvocation invocation) throws Exception {
ActionContext actionContext = invocation.getInvocationContext();
HttpServletResponse response = (HttpServletResponse) actionContext
.get(StrutsStatics.HTTP_RESPONSE);
try {
ValueStack stack = invocation.getStack();
Chart chart = (Chart)stack.findValue("ofcChart");
response.setContentType("application/json-rpc;charset=utf-8");
response.setHeader("Cache-Control", "no-cache");
response.setHeader("Expires", "0");
response.setHeader("Pragma", "No-cache");
PrintWriter out = response.getWriter();
out.print(chart.toString());
} catch (IOException exception) {
throw exception;
}
}
}
struts.xml的配置文件中改为:
<package name="ofc2-default" extends="struts-default">
<result-types>
<result-type name="ofc2" class="com.****.reportshape.utils.OFC2Result"/>
</result-types>
</package>
现在我们就可把ofc2作为返回类型啦。
到此,组件集成基本就大功告成了,下一篇中我会把我写的demo的代码贴出来,欢迎拍砖啥的、、、