xml 有待优化
<!-- 报表sql语句 状态是5开始。 --> <select id="getEcharts" resultType="com.thinkgem.jeesite.modules.ztbdb.entity.cszzb.TestBaoBiao"> select v.month sj,ifnull(b.status,0) sl from past_month_view v left join (select DATE_FORMAT(t.update_date,'%Y-%m')month, count(t.status) status from test_ztb_main t where DATE_FORMAT(t.update_date,'%Y-%m') > DATE_FORMAT(date_sub(curdate(),interval 12 month),'%Y-%m') and t.status = 5 group by t.status,month) b on v.month = b.month group by v.month; </select> <!-- 报表sql语句结束。 --> <!-- 报表sql语句 状态是4开始。 --> <select id="getEcharts4" resultType="com.thinkgem.jeesite.modules.ztbdb.entity.cszzb.TestBaoBiao"> select v.month sj,ifnull(b.status,0) sl from past_month_view v left join (select DATE_FORMAT(t.update_date,'%Y-%m')month, count(t.status) status from test_ztb_main t where DATE_FORMAT(t.update_date,'%Y-%m') > DATE_FORMAT(date_sub(curdate(),interval 12 month),'%Y-%m') and t.status = 4 group by t.status,month) b on v.month = b.month group by v.month; </select> <!-- 报表sql语句结束。 --> <!-- 报表sql语句 状态是3开始。 --> <select id="getEcharts3" resultType="com.thinkgem.jeesite.modules.ztbdb.entity.cszzb.TestBaoBiao"> select v.month sj,ifnull(b.status,0) sl from past_month_view v left join (select DATE_FORMAT(t.update_date,'%Y-%m')month, count(t.status) status from test_ztb_main t where DATE_FORMAT(t.update_date,'%Y-%m') > DATE_FORMAT(date_sub(curdate(),interval 12 month),'%Y-%m') and t.status = 3 group by t.status,month) b on v.month = b.month group by v.month; </select> <!-- 报表sql语句结束。 --> <!-- 报表sql语句 状态是2开始。 --> <select id="getEcharts2" resultType="com.thinkgem.jeesite.modules.ztbdb.entity.cszzb.TestBaoBiao"> select v.month sj,ifnull(b.status,0) sl from past_month_view v left join (select DATE_FORMAT(t.update_date,'%Y-%m')month, count(t.status) status from test_ztb_main t where DATE_FORMAT(t.update_date,'%Y-%m') > DATE_FORMAT(date_sub(curdate(),interval 12 month),'%Y-%m') and t.status = 2 group by t.status,month) b on v.month = b.month group by v.month; </select> <!-- 报表sql语句结束。 --> <!-- 报表sql语句 状态是1开始。 --> <select id="getEcharts1" resultType="com.thinkgem.jeesite.modules.ztbdb.entity.cszzb.TestBaoBiao"> select v.month sj,ifnull(b.status,0) sl from past_month_view v left join (select DATE_FORMAT(t.update_date,'%Y-%m')month, count(t.status) status from test_ztb_main t where DATE_FORMAT(t.update_date,'%Y-%m') > DATE_FORMAT(date_sub(curdate(),interval 12 month),'%Y-%m') and t.status = 1 group by t.status,month) b on v.month = b.month group by v.month; </select>
dao
// 报表sql5 public List<TestBaoBiao> getEcharts(); // 报表sql4 public List<TestBaoBiao> getEcharts4(); // 报表sql3 public List<TestBaoBiao> getEcharts3(); // 报表sql2 public List<TestBaoBiao> getEcharts2(); // 报表sql1 public List<TestBaoBiao> getEcharts1();
实体类
public class TestBaoBiao {
private String sj;
private String sl;
public String getSj() {
return sj;
}
public void setSj(String sj) {
this.sj = sj;
}
public String getSl() {
return sl;
}
public void setSl(String sl) {
this.sl = sl;
}
public TestBaoBiao() {
super();
}
public TestBaoBiao(String sj, String sl) {
super();
this.sj = sj;
this.sl = sl;
}
@Override
public String toString() {
return "TestBaoBiao [sj=" + sj + ", sl=" + sl + "]";
}
}
业务层
// 报表的echarts
public List<TestBaoBiao> getEcharts(){
return TestZtbMainaDao.getEcharts();
}
// 报表的echarts4
public List<TestBaoBiao> getEcharts4(){
return TestZtbMainaDao.getEcharts4();
}
// 报表的echarts3
public List<TestBaoBiao> getEcharts3(){
return TestZtbMainaDao.getEcharts3();
}
// 报表的echarts2
public List<TestBaoBiao> getEcharts2(){
return TestZtbMainaDao.getEcharts2();
}
// 报表的echarts1
public List<TestBaoBiao> getEcharts1(){
return TestZtbMainaDao.getEcharts1();
}
控制层
//报表的url
@RequestMapping(value="Ecart")
@ResponseBody
public Map getEcart(Model model){
List<TestBaoBiao> list5 = testZtbMainaService.getEcharts();
List<TestBaoBiao> list4 = testZtbMainaService.getEcharts4();
List<TestBaoBiao> list3 = testZtbMainaService.getEcharts3();
List<TestBaoBiao> list2 = testZtbMainaService.getEcharts2();
List<TestBaoBiao> list1 = testZtbMainaService.getEcharts1();
Map map = new HashMap<Object,String>();
/*JsonConfig jsonConfig = new JsonConfig();
jsonConfig.setCycleDetectionStrategy(CycleDetectionStrategy.LENIENT);
JSONObject json =JSONObject.fromObject(map, jsonConfig);
String result =json.toString();*/
JSONArray json = JSONArray.fromObject(list5);
/*String ecarts = json.toString();*/
map.put("row", list5);
map.put("row4", list4);
map.put("row3", list3);
map.put("row2", list2);
map.put("row1", list1);
return map;
}
前台代码
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="decorator" content="default" />
<title></title>
<style type="text/css">
#main {
float:left;
width: 60%;
height: 400px;
}
#main1{
float:right;
width: 40%;
height: 400px;
}
</style>
</head>
<body style="width:100%;height:100%">
<script src="${ctxStatic}/common/echarts/echarts-all.js"></script>
<script src="${ctxStatic}/common/jquery.min.js"></script>
<div id="main"></div>
<div id="main1"></div>
<script type="text/javascript">
var names = []; //类别数组（实际用来盛放X轴坐标值）
var nums = []; //销量数组（实际用来盛放Y坐标值）
var nums4 = []; //销量数组（实际用来盛放Y坐标值）
var nums3 = []; //销量数组（实际用来盛放Y坐标值）
var nums2 = []; //销量数组（实际用来盛放Y坐标值）
var nums1 = []; //销量数组（实际用来盛放Y坐标值）
var sum1=0;
var sum2=0;
var sum3=0;
var sum4=0;
var sum5=0;
$.ajax({
type:"GET",
url:'${ctx}/ztbdb/cszzb/testZtbMaina/Ecart',
contentType:'application/x-www-form-urlencoded;charset=UTF-8',
dataType:"json",
success:function(data){
/* JSON.parseObject(jsonString, Object.class); */
/* var json =jQuery.parseJSON(data.row); */
var json = data.row;
var json4 = data.row4;
var json3 = data.row3;
var json2 = data.row2;
var json1 = data.row1;
/* var str= JSON.parse(data[0].row); */
for(var i=0;i<json.length;i++){
names.push(json[i].sj);
}
for(var i=0;i<json.length;i++){
nums.push(parseInt(json[i].sl));
sum5 =sum5+parseInt(json[i].sl);
console.log(sum5);
}
for(var i=0;i<json4.length;i++){
nums4.push(parseInt(json4[i].sl));
sum4 = sum4+parseInt(json4[i].sl);
}
for(var i=0;i<json3.length;i++){
nums3.push(parseInt(json3[i].sl));
sum3 = sum3+parseInt(json3[i].sl);
}
for(var i=0;i<json2.length;i++){
nums2.push(parseInt(json2[i].sl));
sum2 =sum2+parseInt(json2[i].sl);
}
for(var i=0;i<json1.length;i++){
nums1.push(parseInt(json1[i].sl));
sum1= sum1+parseInt(json1[i].sl);
}
var myChart = echarts.init(document.getElementById('main'));
var myChart1 = echarts.init(document.getElementById('main1'));
// 过渡---------------------
myChart.showLoading({
text: '正在努力的读取数据中...', //loading话术
});
// ajax getting data...............
// ajax callback
myChart.hideLoading();
// 图表使用-------------------
var option = {
title : {
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['','','','',']
},
calculable : true,
xAxis : [
{
type : 'category',
data : names
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'',
type:'bar',
data:nums1,
},
{
name:'',
type:'bar',
data:nums2,
}, {
name:'',
type:'bar',
data:nums3,
}, {
name:'',
type:'bar',
data:nums4,
}, {
name:'',
type:'bar',
data:nums,
},
]
};
var option1 = {
title : {
text: '',
subtext: '',
x:'center'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient : 'vertical',
x : 'left',
data:['','','','','']
},
calculable : true,
series : [
{
name:'',
type:'pie',
radius : '55%',
center: ['50%', '60%'],
data:[
{value:sum1, name:'：'+sum1+'件'},
{value:sum2, name:'：'+sum2+'件'},
{value:sum3, name:'：'+sum3+'件'},
{value:sum4, name:'：'+sum4+'件'},
{value:sum5, name:'：'+sum5+'件'}
]
}
]
};
myChart.setOption(option);
myChart1.setOption(option1);
},error:function(){
}
});
</script>
</body>
</html>
前台效果
原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/industrynews/13134.html