1。jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!-- context path -->
<t:base type="jquery,easyui"></t:base>
<script type="text/javascript" src="plug-in/Highcharts-2.2.5/js/highcharts.src.js"></script>
<script type="text/javascript" src="plug-in/Highcharts-2.2.5/js/modules/exporting.src.js"></script>
<c:set var="ctxPath" value="${pageContext.request.contextPath}" />
<script type="text/javascript">
$(function() {
$(document).ready(function() {
var chart;
$.ajax({
type : "POST",
url : "caseInfosController.do?studentCount&reportType=line",
success : function(jsondata) {
data = eval(jsondata);
chart = new Highcharts.Chart({
chart : {
renderTo : 'containerline',
plotBackgroundColor : null,
plotBorderWidth : null,
plotShadow : false
},
title : {
text : '<t:mutiLang langKey="案件类型比例图"/>-<b><t:mutiLang langKey="common.line.chart"/></b>'
},
xAxis : {
categories : [ '民保案件', '执保案件']
},
tooltip : {
shadow: false,
percentageDecimals : 1,
formatter: function() {
return '<b>'+this.point.name + '</b>:' + Highcharts.numberFormat(this.percentage, 1) +'%';
}
},
exporting:{
filename:'pie',
url:'${ctxPath}/caseInfosController.do?export'
},
plotOptions : {
pie : {
allowPointSelect : true,
cursor : 'pointer',
showInLegend : true,
dataLabels : {
enabled : true,
color : '#000000',
connectorColor : '#000000',
formatter : function() {
return '<b>' + this.point.name + '</b>: ' + Highcharts.numberFormat(this.percentage, 1)+"%";
}
}
}
},
series : data
});
}
});
});
});
</script>
<script type="text/javascript">
$(function() {
$(document).ready(function() {
var chart;
$.ajax({
type : "POST",
url : "caseInfosController.do?studentCount&reportType=column",
success : function(jsondata) {
data = eval(jsondata);
console.log(data);
chart = new Highcharts.Chart({
chart : {
renderTo : 'containerCol',
plotBackgroundColor : null,
plotBorderWidth : null,
plotShadow : false
},
title : {
text : '<t:mutiLang langKey="案件类型比例图"/>-<b><t:mutiLang langKey="common.histogram"/></b>'
},
xAxis : {
categories : [ '民保案件', '执保案件']
},
tooltip : {
percentageDecimals : 1,
formatter: function() {
return '<b>'+this.point.name + '</b>:' + Highcharts.numberFormat(this.percentage, 1) +'%';
}
},
exporting:{
filename:'column',
url:'${ctxPath}/caseInfosController.do?export'//
},
plotOptions : {
column : {
allowPointSelect : true,
cursor : 'pointer',
showInLegend : true,
dataLabels : {
enabled : true,
color : '#000000',
connectorColor : '#000000',
formatter : function() {
return '<b>' + this.point.name + '</b>: ' +Highcharts.numberFormat(this.percentage, 1)+"%";
}
}
}
},
series : data
});
}
});
});
});
</script>
<script type="text/javascript">
$(function() {
$(document).ready(function() {
var chart;
$.ajax({
type : "POST",
url : "caseInfosController.do?studentCount&reportType=pie",
success : function(jsondata) {
data = eval(jsondata);
chart = new Highcharts.Chart({
chart : {
renderTo : 'containerPie',
plotBackgroundColor : null,
plotBorderWidth : null,
plotShadow : false
},
title : {
text : '<t:mutiLang langKey="案件类型比例图"/>-<b><t:mutiLang langKey="common.pie.chart"/></b>'
},
xAxis : {
categories : [ '民保案件', '执保案件']
},
tooltip : {
shadow: false,
percentageDecimals : 1,
formatter: function() {
return '<b>'+this.point.name + '</b>:' + Highcharts.numberFormat(this.percentage, 1) +'%';
}
},
exporting:{
filename:'pie',
url:'${ctxPath}/caseInfosController.do?export'
},
plotOptions : {
pie : {
allowPointSelect : true,
cursor : 'pointer',
showInLegend : true,
dataLabels : {
enabled : true,
color : '#000000',
connectorColor : '#000000',
formatter : function() {
return '<b>' + this.point.name + '</b>: ' + Highcharts.numberFormat(this.percentage, 1)+"%";
}
}
}
},
series : data
});
}
});
});
});
</script>
<span id="containerline" style="float: left; width: 30%; height: 60%"></span>
<span id="containerCol" style="float: left; width: 38%; height: 60%"></span>
<span id="containerPie" style="width: 30%; height: 60%"></span>
<!-- update-begin--Author:jg_renjie Date:20150613 for:页面自适应页面,不会出现左右滚动条 -->
<div style="width: 100%; height: 38%;">
<t:datagrid name="studentStatisticList" title="案件统计" actionUrl="caseInfosController.do?listAllStatisticByJdbc" idField="id" fit="true">
<t:dgCol title="id" field="id" hidden="true"></t:dgCol>
<t:dgCol title="案件类别" field="ajlx" dictionary="caseType" width="130"></t:dgCol>
<t:dgCol title="案件数量" field="personcount" width="130"></t:dgCol>
<t:dgCol title="案件比例" field="rate" width="130"></t:dgCol>
</t:datagrid>
</div>
<script type="text/javascript">
$(function(){
$(document.body).css("width","99.3%");
});
</script>
<!-- add-update--Author:jg_renjie Date:20150613 for:页面自适应页面,不会出现左右滚动条 -->
2.controller
//班级学生人数比例分析国际化Key
private static final String CLASS_STUDENT_COUNT_ANALYSIS = "Case type scale";
@Autowired
private MutiLangServiceI mutiLangService;
/**
* 统计集合页面
*
* @return
*/
@RequestMapping(params = "imgCount")
public ModelAndView studentStatisticTabs(HttpServletRequest request) {
return new ModelAndView("cn/com/skyvis/bqaj/count");
}
@RequestMapping(params = "listAllStatisticByJdbc")
public void listAllStatisticByJdbc(HttpServletRequest request, HttpServletResponse response, DataGrid dataGrid) {
List<Map<String,Object>> maplist=systemService.findForJdbc("select ajlx,count(ajlx) personcount from bqaj_caseinfo GROUP BY ajlx", null);
Long countSutent = systemService.getCountForJdbc("SELECT COUNT(1) FROM bqaj_caseinfo WHERE 1=1");
for(Map map:maplist){
Long personcount = Long.parseLong(map.get("personcount").toString());
Double percentage = 0.0;
if (personcount != null && personcount.intValue() != 0) {
percentage = new Double(personcount)/countSutent;
}
map.put("rate", String.format("%.2f", percentage*100)+"%");
}
Long count = 0L;
if(JdbcDao.DATABSE_TYPE_SQLSERVER.equals(DBTypeUtil.getDBType())){
count = systemService.getCountForJdbcParam("select count(0) from ( select ajlx classname,count(ajlx) totalclass from bqaj_caseinfo GROUP BY ajlx ) as t( classname, totalclass)",null);
}else{
count = systemService.getCountForJdbcParam("select count(0) from (select ajlx,count(ajlx) from bqaj_caseinfo GROUP BY ajlx)t",null);
}
dataGrid.setTotal(count.intValue());
dataGrid.setResults(maplist);
TagUtil.datagrid(response, dataGrid);
}
/**
* 报表数据生成
*
* @return
*/
@RequestMapping(params = "studentCount")
@ResponseBody
public List<Highchart> studentCount(HttpServletRequest request,String reportType, HttpServletResponse response) {
List<Highchart> list = new ArrayList<Highchart>();
Highchart hc = new Highchart();
StringBuffer sb = new StringBuffer();
sb.append("select ajlx,count(ajlx) from CaseInfosEntity GROUP BY ajlx");
List userBroswerList = systemService.findByQueryString(sb.toString());
Long count = systemService.getCountForJdbc("SELECT COUNT(1) FROM bqaj_caseinfo WHERE 1=1");
List lt = new ArrayList();
hc = new Highchart();
//update-begin--Author:JueYue Date:20140724 for:国际化--------------------
hc.setName(mutiLangService.getLang(CLASS_STUDENT_COUNT_ANALYSIS));
//update-end--Author:JueYue Date:20140724 for:国际化--------------------
hc.setType(reportType);
Map<String, Object> map;
if (userBroswerList.size() > 0) {
for (Object object : userBroswerList) {
map = new HashMap<String, Object>();
Object[] obj = (Object[]) object;
map.put("name", obj[0]);
map.put("y", obj[1]);
Long groupCount = (Long) obj[1];
Double percentage = 0.0;
if (count != null && count.intValue() != 0) {
percentage = new Double(groupCount)/count;
}
map.put("percentage", percentage*100);
lt.add(map);
}
}
hc.setData(lt);
list.add(hc);
return list;
}
/**
* 报表打印
* @param request
* @param response
* @throws IOException
*/
@RequestMapping(params = "export")
public void export(HttpServletRequest request, HttpServletResponse response)
throws IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
String type = request.getParameter("type");
String svg = request.getParameter("svg");
String filename = request.getParameter("filename");
filename = filename == null ? "chart" : filename;
ServletOutputStream out = response.getOutputStream();
try {
if (null != type && null != svg) {
svg = svg.replaceAll(":rect", "rect");
String ext = "";
Transcoder t = null;
if (type.equals("image/png")) {
ext = "png";
t = new PNGTranscoder();
} else if (type.equals("image/jpeg")) {
ext = "jpg";
t = new JPEGTranscoder();
} else if (type.equals("application/pdf")) {
ext = "pdf";
t = (Transcoder) new PDFTranscoder();
} else if (type.equals("image/svg+xml"))
ext = "svg";
response.addHeader("Content-Disposition",
"attachment; filename=" + new String(filename.getBytes("GBK"),"ISO-8859-1") + "." + ext);
response.addHeader("Content-Type", type);
if (null != t) {
TranscoderInput input = new TranscoderInput(
new StringReader(svg));
TranscoderOutput output = new TranscoderOutput(out);
try {
t.transcode(input, output);
} catch (TranscoderException e) {
out
.print("Problem transcoding stream. See the web logs for more details.");
e.printStackTrace();
}
} else if (ext.equals("svg")) {
// out.print(svg);
OutputStreamWriter writer = new OutputStreamWriter(out,
"UTF-8");
writer.append(svg);
writer.close();
} else
out.print("Invalid type: " + type);
} else {
response.addHeader("Content-Type", "text/html");
out
.println("Usage:\n\tParameter [svg]: The DOM Element to be converted."
+ "\n\tParameter [type]: The destination MIME type for the elment to be transcoded.");
}
} finally {
if (out != null) {
out.flush();
out.close();
}
}
}