準(zhǔn)備以下開源項(xiàng)目：
1. Struts 2.1.6
2. Open Flash Chart 2 Version 2 Lug Wyrm Charmer (28th, July 2009)
3. jofc2，這東西不知道是沒(méi)做好還是什么意思，好像和ofc2不怎么匹配，最好下源碼，有什么問(wèn)題直接改。
4. log4j
用eclipse新建動(dòng)態(tài)網(wǎng)站，取名OFC2Demo，將Struts2 lib目錄下commons-fileupload-1.2.1.jar、commons-logging-1.0.4.jar、freemarker-2.3.13.jar、ognl-2.6.11.jar、struts2-core-2.1.6.jar、xstream-1.3.1.jar和xwork-2.1.2.jar、log4j.jar復(fù)制到WebContent\lib目錄下。
使用svn下載jofc2源碼，http
://jofc2.googlecode.com/svn/trunk/，將下載后的src目錄下的jofc2整個(gè)目錄和下級(jí)內(nèi)容全部復(fù)制到項(xiàng)目src目錄下。
在web.xml中加入struts2攔截器
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
<display-name>OFC2Demo</display-name>
<filter>
<filter-name>struts2</filter-name>
<filter-class>
org.apache.struts2.dispatcher.FilterDispatcher
</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>
在返回jofc2生成Open Flash Chart數(shù)據(jù)時(shí)，本來(lái)想用jsonplugin插件，但發(fā)現(xiàn)序列化jofc2的Chart對(duì)象時(shí)，許多元素名稱和Chart.toString()不同，這使得Open Flash Chart解析數(shù)據(jù)時(shí)不認(rèn)識(shí)。所以需增加一個(gè)Struts2自定義Result Type，步驟如下：
新建類，OFC2Plugin
package com.xy.strutsplugin;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
import jofc2.model.Chart;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
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;
private static final Log log = LogFactory.getLog(OFC2Result.class);
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();
log.debug(chart.toString());
out.print(chart.toString());
} catch (IOException exception) {
log.error(exception.getMessage(), exception);
throw exception;
}
}
}
在src下新建struts-plugin.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="ofc2-default" extends="struts-default">
<result-types>
<result-type name="ofc2" class="com.xy.strutsplugin.OFC2Result"/>
</result-types>
</package>
</struts>
配置log4j，以查看json輸出信息。
在src下增加兩個(gè)文件
commons-logging.properties
## set Log as Log4j
org.apache.commons.logging.Log=org.apache.commons.logging.impl.Log4JLogger
log4j.properties
# This is the configuring for logging displayed in the Application Server
log4j.rootCategory=DEBUG,stdout
#stdout configure
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern= %d %p [%c] - <%m>%n
##
log4j.logger.com.xy.strutsplugin.OFC2Result=DEBUG
好了，現(xiàn)在將ofc所需的包添加到項(xiàng)目中
在WebContent目錄下添加文件夾ofc2，將open-flash-chart-2-Lug-Wyrm-Charmer目錄下的open-flash-chart.swf和js目錄復(fù)制到新建的ofc2目錄下。
演示Line Chart
在Action層增加類LineAction
package com.xy.action;
import java.text.DateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Locale;
import jofc2.model.Chart;
import jofc2.model.elements.LineChart;
import jofc2.model.axis.YAxis;
import jofc2.model.Text;
import com.opensymphony.xwork2.ActionSupport;
public class LineAction extends ActionSupport{
private static final long serialVersionUID = -5759373192727732648L;
private Chart ofcChart;
public Chart getOfcChart() {
return ofcChart;
}
public String dot(){
List<LineChart.Dot> data1=new ArrayList<LineChart.Dot>()
, data2=new ArrayList<LineChart.Dot>()
, data3=new ArrayList<LineChart.Dot>();
for(double i=0;i<6.2;i+=0.2){
// line 1 dot
LineChart.Dot dot1 = new LineChart.Dot(Math.sin(i)*1.9+10);
dot1.setDotSize(5); // 點(diǎn)大小
dot1.setColour("#f00000"); // 設(shè)置點(diǎn)顏色
data1.add(dot1);
// line 2 dot
LineChart.Dot dot2 = new LineChart.Dot(Math.sin(i)*1.9+7);
dot2.setDotSize(3);
dot2.setHaloSize(1); // 點(diǎn)外空白大小
dot2.setColour("#3D5C56");
data2.add(dot2);
// line 3 dot
LineChart.Dot dot3 = new LineChart.Dot(Math.sin(i)*1.9+4);
dot3.setDotSize(4);
dot3.setHaloSize(2);
data3.add(dot3);
}
Date date = new Date();
Locale locale = new Locale("zh","CN");
DateFormat dateFormat = DateFormat.getDateInstance(DateFormat.FULL, locale);
// line 1
LineChart line1 = new LineChart();
line1.setDotStyle(new LineChart.Style(LineChart.Style.Type.DOT));
line1.setWidth(1); // 線寬
line1.addDots(data1); // 增加數(shù)據(jù)
// line 2
LineChart line2 = new LineChart();
line2.setDotStyle(new LineChart.Style(LineChart.Style.Type.DOT));
line2.setColour("#3D5C56");
line2.setWidth(2);
line2.addDots(data2);
// line3
LineChart line3 = new LineChart();
line3.setDotStyle(new LineChart.Style(LineChart.Style.Type.DOT));
line3.setWidth(6);
line3.addDots(data3);
YAxis y = new YAxis();
y.setRange(0, 15, 5); // 設(shè)置Y柚范圍，參數(shù)依次為最小值、最大值、間隔
ofcChart = new Chart();
ofcChart.setTitle(new Text(dateFormat.format(date))); // 設(shè)置標(biāo)題
ofcChart.addElements(line1); // 增加線到圖表
ofcChart.addElements(line2);
ofcChart.addElements(line3);
ofcChart.setYAxis(y); // 設(shè)置Y柚
return SUCCESS;
}
}
增加struts配置文件
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="ofc2" extends="ofc2-default">
<action name="line" class="com.xy.action.LineAction">
<result type="ofc2"/>
</action>
</package>
</struts>
在WebContent目錄下增加line目錄，目錄下增加dot.html，對(duì)應(yīng)官方示例Line Dot，dot.html內(nèi)容如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Line Dot</title>
<script type="text/javascript" src="../jquery/jquery.js"></script>
<script type="text/javascript" src="../ofc2/js/swfobject.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
swfobject.embedSWF("../ofc2/open-flash-chart.swf",
"chart", "550", "300", "9.0.0",
"expressInstall.swf",
{"data-file":"line!dot"});
});
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
這里用到了一點(diǎn)jquery的東西，請(qǐng)把jquery的包增加到相應(yīng)目錄下。
運(yùn)行Tomcat，瀏覽器輸入http://localhost:8080/OFC2Demo/line/dot.html，出下如下圖表
