Jqpivottable实现多维分析
多维分析就是在原有一维、二维分析的基础上继续添加维度,已实现复杂的统计分析,以清晰直观的视角为决策服务的技术。
JAVA领域中也有很多不错的BI框架,比如OpenI,JasperSoft,SpagoBI,pentaho等等。
这些要么比较庞大,学习成本较高;要么虽然简单,但对中文的支持比较差,总让人感觉差强人意。
Jqpivottable 是一款基于Jquery的多维数据分析处理框架。使用起来轻便、快捷。最主要的是你可以以此设计出很优雅很高效的界面。
资源地址:http://code.google.com/p/jqpivottable/
在以上网站下载最新的资源,本人使用的是1.1版。可能是由于访问受限的原因,很抱歉,这个框架没有公开API。只能根据demo来窥探其奥秘了。
下面介绍Jqpivottable的使用。1.1版的压缩包中含有CSS/Scripts两个文件夹和两个PHP页面。这两个PHP是一个简单的小例子。如果你使用PHP的框架,这个再好不过了。可以创建数据库直接运行。
将css和scripts两个文件夹拷贝到项目中,然后新建一个jqpt_demo.jsp文件并将index.php的内容拷贝到这个jsp文件。稍作修改。
jqpt_demo.jsp页面内容如下:
<%@ page language="java" pageEncoding="UTF-8"%> <%@taglib uri="/struts-tags" prefix="s"%> <%@ include file="common/header.jsp"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>浙江省电力公司作业项目安全风险管控系统</title> <link href="${root}/css/PivotTable.css" rel="stylesheet" type="text/css" /> <script src="${root}/scripts/jquery-1.6.4.min.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.core.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.widget.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.mouse.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.draggable.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.droppable.js" type="text/javascript"></script> <script src="${root}/scripts/jquery.ui.sortable.js" type="text/javascript"></script> <script src="${root}/scripts/json2.js" type="text/javascript"></script> <script src="${root}/scripts/number-functions.js" type="text/javascript"></script> <script src="${root}/scripts/jqPivotTable.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $("#pivotT").pivottable({ urldata: "jxplan/jpt.action", //URL data from AJAX urlfields: "500.jsp", //jxplan/jpt.action//URL fields catalog from AJAX (obsolete in v 1.1) table: "jx_plan_item", columns: ["电压等级","属性","风险等级"], rows: ["是否计划外", "计划类型"], filters: ["风险类型"], datafields: "risk_level_count", op: "COUNT" //sum or count }); }) </script> </head> <body> <form id="frm1" name="frm1" method="post" action=""> <div class="main"> <table id="pivotT"> </table> </div> </form> </body> </html>
这里需要注意一点的是:虽然1.1版本放弃了urlfields这个属性,但我们是不能省略的。省略后就无法访问后台并显示数据了。为了方便可以将urldata和urlfields的属性值设置为一致。
下面谈谈这几个属性
urldata:--异步获取数据的地址
urlfields:--该属性在1.1后已被弃用
table:表名
columns:列中要显示的字段(可以多维)
rows:行中需显示的字段(可以多维)
filters:过滤器,用于过滤数据的条件
datafields:显示的数据字段名
op:统计方式,可以是sum或count
这些属性理论上都应该可以在后台获取,但通过查看jqPivotTable.js代码我们可以发现,这些属性并没有提交到后台,这是一件比较遗憾的事情。也就是说,这些属性目前只用于前台。当然,我们可以通过修改代码来实现数据的传递,有兴趣的同学不妨试试。
以下是后台Action中对应的方法
/** * 多维分析 * @return */ public String jpt()throws Exception{ //查询结果集 List<JxPlanItemMultidimAnalysis> list = jxPlanItemServiceImpl.list(null); //定义一些常用的符号 final String lbb="{",rbb="}",dq="\"",colone=":",lmb="[",rmb="]",comma=","; StringBuffer sb= new StringBuffer(); sb.append(lbb).append(dq).append("items").append(dq).append(colone).append(lmb); for (JxPlanItemMultidimAnalysis j : list) { sb.append(lbb); sb.append(dq).append("电压等级").append(dq).append(colone).append(dq).append(j.getVolLevel()==null?"":j.getVolLevel()).append(dq);// sb.append(comma); sb.append(dq).append("是否计划外").append(dq).append(colone).append(dq).append(ValidateUtil.matchString(j.getIsOut(), String.valueOf(true))?"是":"否").append(dq); sb.append(comma); sb.append(dq).append("计划类型").append(dq).append(colone).append(dq).append(j.getPlanType()==null?"":j.getPlanType()).append(dq); sb.append(comma); sb.append(dq).append("属性").append(dq).append(colone).append(dq).append(j.getProjectAttribute()==null?"":j.getProjectAttribute()).append(dq); sb.append(comma); sb.append(dq).append("风险类型").append(dq).append(colone).append(dq).append(j.getRiskType()==null?"":j.getRiskType()).append(dq); sb.append(comma); sb.append(dq).append("风险等级").append(dq).append(colone).append(dq).append(j.getRiskLevel()==null?"":j.getRiskLevel()).append(dq); sb.append(comma); sb.append(dq).append("risk_level_count").append(dq).append(colone).append(dq).append(j.getRiskLevelCount()).append(dq); sb.append(rbb).append(comma); } sb.deleteCharAt(sb.length()-1); sb.append(rmb).append(rbb); jsonString = sb.toString(); return SUCCESS; }
这里我们将获得的结果转成json格式的字符串,返回给前端页面。
这里我没有直接用JSONObject或者JSONArray对象来转是因为我的字段需要中文名称,便于在页面显示。