最近做了一个SSH项目,其中有一个统计模块,查看选中的软件的下载量,通过amchart报表工具显示出软件日下载量,月下载量以及年下载量,下面简单介绍,amchart在struts2中的应用。(关于amchart的介绍,这里不累述,网上很多文章都有说明)
一、下载amchart
http://www.amcharts.com/download
选择你想使用的报表显示形状进行下载,较常用的主要是曲线图和饼图,这里以曲线图为例:Line & Area
二、配置struts2
新建一个Web Project,比如:amchartDemo
1. JAR包引用
这里使用的是struts2的最新JAR包:struts-2.2.1.1:
该版本的struts2需要用到的JAR包有7个,一个都不能少
可在下面工程中获取:struts-2.2.1.1\apps\struts2-blank\WEB-INF\lib
commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
freemarker-2.3.16.jar
javassist-3.7.ga.jar
ognl-3.0.jar
struts2-core-2.2.1.1.jar
xwork-core-2.2.1.1.jar
2. 配置web.xml (WebRoot\WEB-INF\web.xml)
<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>
3. 配置struts.xml
可从 struts-2.2.1.1\apps\struts2-blank\WEB-INF\src\java\ 获取struts.xml,复制到你自己的项目工程(amchartDemo)的src下
<struts> <package name="statistic" extends="struts-default"> <action name="report" class="com.web.action.ReportAction"> <result name="show-suc">/index.jsp</result> </action> </package> </struts>
4. 编写Action
根据以上struts.xml的配置,创建ReportAction类,以及需要的Bean:
package com.web.action; import java.util.ArrayList; import java.util.List; import java.util.Map; import java.util.TreeMap; import com.model.beans.BaseBean; import com.opensymphony.xwork2.ActionContext; import com.opensymphony.xwork2.ActionSupport; public class ReportAction extends ActionSupport { public String showDay() throws Exception { List<BaseBean> daylist = new ArrayList<BaseBean>(); /*================数据模拟==================*/ daylist.add(createBean(1L,"软件A","#FF0000")); daylist.add(createBean(2L,"软件B","#FFC0CB")); daylist.add(createBean(3L,"软件C","#40E0D0")); daylist.add(createBean(4L,"软件D","#9ACD32")); daylist.add(createBean(5L,"软件E","#00FF7F")); /*=========================================*/ ActionContext.getContext().getSession().put("chartDataList", daylist); return "show-suc"; } /** * 创建模拟数据 * @author Christy Lan * @version 1.0 * @param * @return BaseBean * @exception */ private BaseBean createBean(Long id, String softName, String color){ BaseBean bean = new BaseBean(); bean.setSoftId(id); bean.setSoftName(softName); bean.setColor(color); Map<Integer, Integer> dataMap = new TreeMap<Integer, Integer>(); //一天24小时 for(int i = 1; i <= 24; i++){ dataMap.put(i, getRandom());//模拟每小时的下载量 } bean.setDataMap(dataMap); return bean; } private Integer getRandom(){ return (int)(Math.random()*1000); } }
package com.model.beans; import java.util.Map; public class BaseBean { private Long softId;//软件ID private String softName;//软件名字 private String color;//该软件在amchart报表中显示的颜色 private Map<Integer, Integer> dataMap;//存放统计信息 public Long getSoftId() { return softId; } public void setSoftId(Long softId) { this.softId = softId; } public String getSoftName() { return softName; } public void setSoftName(String softName) { this.softName = softName; } public String getColor() { return color; } public void setColor(String color) { this.color = color; } public Map<Integer, Integer> getDataMap() { return dataMap; } public void setDataMap(Map<Integer, Integer> dataMap) { this.dataMap = dataMap; } }
三、使用amchart
1. 在WebRoot下新建一个目录 WebRoot/statistic/line
2. 解压amline_1.6.4.1.zip
a) 将 amline_1.6.4.1\amline 目录下的swfobject.js复制到statistic目录下(注:swfobject.js放于哪无所谓,关键是页面上的引用)
b) 将 amline_1.6.4.1\amline 目录下的amline.swf 复制到statistic/line目录下
c) 将 amline_1.6.4.1\amline 目录下的amline_settings.xml 复制到statistic/line目录下,同时,把amline_settings.xml改名为day_settings.jsp
3. 修改day_settings.jsp
a) 在day_settings.jsp的最开始处增加如下代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ taglib prefix="s" uri="/struts-tags" %>
b) 将<digits_after_decimal>2</digits_after_decimal> 改为
<digits_after_decimal>0</digits_after_decimal>
这里的数值表示小数点后的位数
c) 将<graphs></graphs>标签里的内容删除,替换成:
<graphs> <s:iterator value="#session.chartDataList" status="st"> <graph gid="<s:property value="#st.index"/>"> <title><s:property value="softName"/></title> <line_width>2</line_width> <color><s:property value="color"/></color> <color_hover><s:property value="color"/></color_hover> <bullet>round_outlined</bullet> <balloon_text_color>000000</balloon_text_color> <balloon_text> <![CDATA[{title} on {series}: 【{value}次】]]> </balloon_text> <selected>true</selected> </graph> </s:iterator> </graphs>
4. 在statistic/line目录下新建day_data.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ taglib prefix="s" uri="/struts-tags" %> <?xml version="1.0" encoding="UTF-8"?> <chart> <series> <s:iterator value="#session.chartDataList" status="st"> <s:if test="#st.index==0"> <s:iterator value="dataMap"> <value xid="<s:property value="key"/>"><s:property value="key"/>时</value> </s:iterator> </s:if> </s:iterator> </series> <graphs> <s:iterator value="#session.chartDataList" status="st"> <graph gid="<s:property value="#st.index"/>"> <s:iterator value="dataMap"> <value xid="<s:property value="key"/>"><s:property value="value"/></value> </s:iterator> </graph> </s:iterator> </graphs> </chart>
5. 补充:破解amchart
在statistic/line目录下新建amcharts_key.txt,内容为
AMCHART-LNKS-1966-6679-1965-1082
<script type="text/javascript" src="<%=basePath %>/statistic/swfobject.js"></script>
<body> <div id="flashcontent"> <strong>You need to upgrade your Flash Player</strong> </div> <script type="text/javascript"> // <![CDATA[ var so = new SWFObject("statistic/line/amline.swf", "amline", "900", "600", "8", "#FFFFFF"); so.addVariable("path", "statistic/line/"); so.addVariable("settings_file", encodeURIComponent("statistic/line/day_settings.jsp?<%=Math.random()%>")); so.addVariable("data_file", encodeURIComponent("statistic/line/day_data.jsp")); so.write("flashcontent"); // ]]> </script> </body>