Jqpivottable实现多维分析

最新推荐文章于 2024-05-29 09:54:45 发布

iteye_3489

最新推荐文章于 2024-05-29 09:54:45 发布

阅读量670

点赞数

分类专栏： jQuery 文章标签： JQuery 多维分析 Jqpivottable ViewUI

jQuery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

多维分析就是在原有一维、二维分析的基础上继续添加维度，已实现复杂的统计分析，以清晰直观的视角为决策服务的技术。

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对象来转是因为我的字段需要中文名称，便于在页面显示。

iteye_3489

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jqpivottable实现多维分析

多维分析就是在原有一维、二维分析的基础上继续添加维度，已实现复杂的统计分析，以清晰直观的视角为决策服务的技术。JAVA领域中也有很多不错的BI框架，比如OpenI，JasperSoft，SpagoBI，pentaho等等。这些要么比较庞大，学习成本较高；要么虽然简单，但对中文的支持比较差，总让人感觉差强人意。Jqpivottable 是一款基于Jquery的多维数据分析处理框架。...
复制链接

扫一扫

专栏目录