FusionCharts 是使用javascript实现统计图表的js组件;其官网地址:http://www.fusioncharts.com。其早期版本FusionCharts Free 是基于flash来实现,而在2014年其脱离开flash完全使用js来实现统计图表的FusionCharts Suite XT来替代FusionCharts Free使其具有充分跨浏览器和终端的特点。到官网下载FusionCharts:
下载完后,解压压缩包“fusioncharts-suite-xt.zip”;
目录如下:
双击打开index.html页面;查看如何使用fusioncharts
查看 Setup ,了解如何安装:
安装说明写到;如果只需要统计图表,那么只要复制js文件夹中的“fusioncharts.js”和“fusioncharts.charts.js”即可。
接着;查看其demo,了解如何使用:
于此;要使用fusioncharts先将“fusioncharts.js”和“fusioncharts.charts.js”和相关主题文件复制到项目的js/fusioncharts文件夹。
JSP:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
//获取当前年份
Calendar cal = Calendar.getInstance();
int curYear = cal.get(Calendar.YEAR);//当前年份
request.setAttribute("curYear", curYear);
List yearList = new ArrayList();
for(int i = curYear; i > curYear-5 ; i--){
yearList.add(i);
}
request.setAttribute("yearList", yearList);
%>
<!DOCTYPE HTML>
<html>
<head>
<%@include file="/common/header.jsp"%>
<title>年度投诉统计图</title>
</head>
<script type="text/javascript" src="${basePath }js/fusioncharts/fusioncharts.js"></script>
<script type="text/javascript" src="${basePath }js/fusioncharts/fusioncharts.charts.js"></script>
<script type="text/javascript" src="${basePath }js/fusioncharts/themes/fusioncharts.theme.fint.js"></script>
<script type="text/javascript">
//加载完dom元素后,执行
$(document).ready(doAnnualStatistic());
//根据年份统计投诉数
function doAnnualStatistic(){
//1、获取年份
var year = $("#year option:selected").val();
if(year == "" || year == undefined){
year = "${curYear}";//默认当前年份
}
//2、根据年份统计
$.ajax({
url:"${basePath }/nsfw/complain_getAnnualStatisticData.action",
data:{"year":year},
type: "post",
dataType:"json",
success: function(data){
if(data != null && data != "" && data != undefined){
var revenueChart = new FusionCharts({
"type": "line",
"renderAt": "chartContainer",
"width": "600",
"height": "400",
"dataFormat": "json",
"dataSource": {
"chart": {
"caption": year + " 年度投诉数统计图",
"xAxisName": "月 份",
"yAxisName": "投 诉 数",
"theme": "fint"
},
"data": data.chartData
}
});
revenueChart.render();
} else {
alert("统计投诉数失败!");
}
},
error: function(){alert("统计投诉数失败!");}
});
}
</script>
<body>
<br>
<div style="text-align:center;width:100%;"><s:select id="year" list="#request.yearList" οnchange="doAnnualStatistic()"></s:select></div>
<br>
<div id="chartContainer" style="text-align:center;width:100%;"></div>
</body>
</html>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size:18px;">action:</span></span>
package cn.itcast.nsfw.complain.action;
import java.net.URLDecoder;
import java.sql.Timestamp;
import java.util.Calendar;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import org.apache.commons.lang3.StringUtils;
import org.apache.commons.lang3.time.DateUtils;
import org.apache.struts2.ServletActionContext;
import cn.itcast.core.action.BaseAction;
import cn.itcast.core.util.QueryHelper;
import cn.itcast.nsfw.complain.entity.Complain;
import cn.itcast.nsfw.complain.entity.ComplainReply;
import cn.itcast.nsfw.complain.service.ComplainService;
import com.opensymphony.xwork2.ActionContext;
public class ComplainAction extends BaseAction {
@Resource
private ComplainService complainService;
private Complain complain;
private String startTime;
private String endTime;
private ComplainReply reply;
private String strTitle;
private String strState;
private Map<String, Object> statisticMap;
//列表
public String listUI(){
//加载状态集合
ActionContext.getContext().getContextMap().put("complainStateMap", Complain.COMPLAIN_STATE_MAP);
try {
QueryHelper queryHelper = new QueryHelper(Complain.class, "c");
if(StringUtils.isNotBlank(startTime)){//查询开始时间之后的投诉数据
startTime = URLDecoder.decode(startTime, "utf-8");
queryHelper.addCondition("c.compTime >= ?", DateUtils.parseDate(startTime+":00", "yyyy-MM-dd HH:mm:ss"));
}
if(StringUtils.isNotBlank(endTime)){//查询结束时间之前的投诉数据
endTime = URLDecoder.decode(endTime, "utf-8");
queryHelper.addCondition("c.compTime <= ?", DateUtils.parseDate(endTime+":59", "yyyy-MM-dd HH:mm:ss"));
}
if(complain != null){
if(StringUtils.isNotBlank(complain.getState())){
queryHelper.addCondition("c.state=?", complain.getState());
}
if(StringUtils.isNotBlank(complain.getCompTitle())){
complain.setCompTitle(URLDecoder.decode(complain.getCompTitle(), "utf-8"));
queryHelper.addCondition("c.compTitle like ?", "%" + complain.getCompTitle() + "%");
}
}
//安装状态升序排序
queryHelper.addOrderByProperty("c.state", QueryHelper.ORDER_BY_ASC);
//按照投诉时间升序排序
queryHelper.addOrderByProperty("c.compTime", QueryHelper.ORDER_BY_ASC);
pageResult = complainService.getPageResult(queryHelper, getPageNo(), getPageSize());
} catch (Exception e) {
e.printStackTrace();
}
return "listUI";
}
//跳转到受理页面
public String dealUI(){
//加载状态集合
ActionContext.getContext().getContextMap().put("complainStateMap", Complain.COMPLAIN_STATE_MAP);
if(complain != null){
strTitle = complain.getCompTitle();
strState = complain.getState();
complain = complainService.findObjectById(complain.getCompId());
}
return "dealUI";
}
public String deal(){
if(complain != null){
Complain tem = complainService.findObjectById(complain.getCompId());
//1、更新投诉的状态为 已受理
if(!Complain.COMPLAIN_STATE_DONE.equals(tem.getState())){//更新状态为 已受理
tem.setState(Complain.COMPLAIN_STATE_DONE);
}
//2、保存回复信息
if(reply != null){
reply.setComplain(tem);
reply.setReplyTime(new Timestamp(new Date().getTime()));
tem.getComplainReplies().add(reply);
}
complainService.update(tem);
}
return "list";
}
//跳转到统计页面
public String annualStatisticChartUI(){
return "annualStatisticChartUI";
}
//根据年度获取该年度下的统计数
public String getAnnualStatisticData(){
//1、获取年份
HttpServletRequest request = ServletActionContext.getRequest();
int year = 0;
if(request.getParameter("year") != null){
year = Integer.valueOf(request.getParameter("year"));
} else {
//默认 当前年份
year = Calendar.getInstance().get(Calendar.YEAR);
}
//2、获取统计年度的每个月的投诉数
statisticMap = new HashMap<String, Object>();
statisticMap.put("msg", "success");
statisticMap.put("chartData", complainService.getAnnualStatisticDataByYear(year));
return "annualStatisticData";
}
public Complain getComplain() {
return complain;
}
public void setComplain(Complain complain) {
this.complain = complain;
}
public String getStartTime() {
return startTime;
}
public void setStartTime(String startTime) {
this.startTime = startTime;
}
public String getEndTime() {
return endTime;
}
public void setEndTime(String endTime) {
this.endTime = endTime;
}
public ComplainReply getReply() {
return reply;
}
public void setReply(ComplainReply reply) {
this.reply = reply;
}
public String getStrTitle() {
return strTitle;
}
public void setStrTitle(String strTitle) {
this.strTitle = strTitle;
}
public String getStrState() {
return strState;
}
public void setStrState(String strState) {
this.strState = strState;
}
public Map<String, Object> getStatisticMap() {
return statisticMap;
}
}
<span style="font-size:18px;">service</span>
package cn.itcast.nsfw.complain.service.impl;
import java.util.ArrayList;
import java.util.Calendar;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.annotation.Resource;
import org.springframework.stereotype.Service;
import cn.itcast.core.service.impl.BaseServiceImpl;
import cn.itcast.core.util.QueryHelper;
import cn.itcast.nsfw.complain.dao.ComplainDao;
import cn.itcast.nsfw.complain.entity.Complain;
import cn.itcast.nsfw.complain.service.ComplainService;
@Service("complainService")
public class ComplainServiceImpl extends BaseServiceImpl<Complain> implements ComplainService {
private ComplainDao complainDao;
@Resource
public void setComplainDao(ComplainDao complainDao) {
super.setBaseDao(complainDao);
this.complainDao = complainDao;
}
@Override
public void autoDeal() {
Calendar cal = Calendar.getInstance();
cal.set(Calendar.DAY_OF_MONTH, 1);//设置当前时间的日期为1号
cal.set(Calendar.HOUR_OF_DAY, 0);//设置当前时间的日期为1号,0时
cal.set(Calendar.MINUTE, 0);//设置当前时间的日期为1号,0分
cal.set(Calendar.SECOND, 0);//设置当前时间的日期为1号,0秒
//1、查询本月之前的待受理的投诉列表
QueryHelper queryHelper = new QueryHelper(Complain.class, "c");
queryHelper.addCondition("c.state=?", Complain.COMPLAIN_STATE_UNDONE);
queryHelper.addCondition("c.compTime < ?", cal.getTime());//本月1号0时0分0秒
List<Complain> list = findObjects(queryHelper);
if(list != null && list.size() > 0){
//2、更新投诉信息的状态为 已失效
for(Complain comp: list){
comp.setState(Complain.COMPLAIN_STATE_INVALID);
update(comp);
}
}
}
@Override
public List<Map> getAnnualStatisticDataByYear(int year) {
List<Map> resList = new ArrayList<Map>();
//1、获取统计数据
List<Object[]> list = complainDao.getAnnualStatisticDataByYear(year);
if(list != null && list.size()>0){
Calendar cal = Calendar.getInstance();
//是否当前年份
boolean isCurYear = (cal.get(Calendar.YEAR) == year);
int curMonth = cal.get(Calendar.MONTH)+1;//当前月份
//2、格式化统计结果
int temMonth = 0;
Map<String, Object> map = null;
for(Object[] obj: list){
temMonth = Integer.valueOf((obj[0])+"");
map = new HashMap<String, Object>();
map.put("label", temMonth+ " 月");
if(isCurYear){//当前年份
//当前年份:如果月份已过的则直接取投诉数并且值为空或null时则设为0;如果月份未过的则全部投诉数置空
if(temMonth > curMonth){//未到月份,则投诉数为空
map.put("value", "");
} else {//已过月份
map.put("value", obj[1]==null?"0":obj[1]);
}
} else {//非当前年份则直接取投诉数并且值为空或null时则设为0
map.put("value", obj[1]==null?"0":obj[1]);
}
resList.add(map);
}
}
return resList;
}
}