实现动态图谱数据
在需要的图谱数据的 加入js代码
<script src="https://img.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script src="https://img.hcharts.cn/highcharts/highcharts.js"></script>
<script src="https://img.hcharts.cn/highcharts/modules/exporting.js"></script>
<script src="//img.hcharts.cn/highcharts/modules/export-data.js"> </script>
前面二个必须要导 后面二个是导出excl文档pdf 图片什么的插件
首先进来页面
定义一个层 这个层就是即将展示图谱数据
<div class="text-right" style="margin-right:5%">
<button onclick="forbidden($('#yczb').val(),$('#hid').val(),$('#sid').val(),$('#cage').val(),$('#csex').val(),$('#ctime').val())" class="btn btn-primary" id="kkw" style="margin-right: 1%"> 查询 </button>
<input type="reset" class="btn btn-primary" value=" 重置 " style="margin-right: 1%">
<input type="button" class="btn btn-primary" value="导出报表">
</div>
注意forbiddn为方法名
后面传递的需要查询的参数
jsp定义查询全部
这是默认查询全部
这边要看你数据库里面需不需要放参数 一般不需要 所以这边要稍微改一下
<body onload="forbidden('1','','','','7','')">
<div class="navbar navbar-default" id="navbar">
<script type="text/javascript">
try {
ace.settings.check('navbar', 'fixed')
} catch (e) {
}
</script>
如果你在上面传递了相对应的参数 就进入一个js方法 这个方法就放在本页面可以 也可以放js 包里面
要确定是否正确进去了这个js
<script type="text/javascript">
function forbidden(yczb,hid,sid,cage,csex,ctime) {
// alert(csex+"ll");
$.post('findRe.action?yczb='+yczb+'&&hid='+hid+'&&sid='+sid+'&&cage='+cage+'&&csex='+csex+'&&ctime='+ctime, function (result) {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: result.tt
}, /*
subtitle: {
text: 'Source: WorldClimate.com'
},*/
xAxis: {
categories:
result.zxy
},
yAxis: {
min: 0,
title: {
text: '人数'
}
},
tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y:.1f} 人</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [{
name: result.man,
data:result.x
}, {
name: result.man1,
data: result.y
}, {
name: result.man2,
data: result.z
}]
});
})
};
</script>
只要查到数据放在相对应的表格里面去就好了 改图谱线谱的图文type: ‘column’ 这个是条形的 如果改其他的可以查一下
以下就是查询的方法 要和数据库的里面一样 就不会出现问题了
@ResponseBody
@RequestMapping("/findRe")
public Map<String,Object> findRe(String yczb,String hid,String sid,String cage,String csex,String ctime){
// System.out.println("异常指标："+yczb + "\t" + "总店id："+hid + "\t"+"分店id："+sid + "\t"+"年龄段："+cage + "\t"
// +"性别："+csex + "\t"+"时间："+ctime + "\t");
//回调函数
Map<String,Object> map1=new HashMap<>();
//动态查询
Map<String,Object> map=new HashMap<>();
map.put("medicalresult","异常");
// 根据什么指标查询
map.put("medicalcode1",yczb);
// 根据哪个时间段查询，默认一个月
map.put("updatetime","2");
map.put("updatetime",ctime);
// 根据哪个总店
map.put("hid",hid);
// 根据哪个分店
map.put("sid",sid);
// 年龄段
map.put("cage",cage);
//合计
map.put("csex",csex);
List<Bt> list=reportService.findAllRe(map);
for (Bt kk : list) {
System.out.println("ww:"+kk.getBday());
}
//男
map.put("csex","男");
List<Bt> list2=reportService.findAllRe(map);
map.put("csex","女");
List<Bt> list3=reportService.findAllRe(map);
// for (Bt sw : list3) {
// System.out.println("777:"+sw.getBcount());
// }
//总异常人数
int[] skt=new int[list.size()];
for (int i=0;i<skt.length;i++){
skt[i]=list.get(i).getBcount()*5;
}
//总异常天数
String[] edg=new String[list.size()];
for (int i=0;i<skt.length;i++){
StringBuffer sb=new StringBuffer();
sb.append(list.get(i).getBday().substring(0,4)+"年");
sb.append(list.get(i).getBday().substring(4,6)+"月");
sb.append(list.get(i).getBday().substring(6,8)+"日");
edg[i]=sb.toString();
}
//男性异常人数
int[] skt2=new int[list2.size()];
for (int i=0;i<skt2.length;i++){
skt2[i]=list2.get(i).getBcount()*5;
}
//女性异常人数
int[] skt3=new int[list3.size()];
for (int i=0;i<skt3.length;i++){
skt3[i]=list3.get(i).getBcount()*5;
}
if (!csex.equals("7")){
map1.put("z",skt);
map1.put("zxy",edg);
map1.put("man",csex);
map1.put("man1",csex);
map1.put("man2",csex);
if (yczb.equals("1")){
map1.put("tt","综合异常报表");
}else if (yczb.equals("2")){
map1.put("tt","血糖异常报表");
}else{
map1.put("tt","总胆固醇异常报表");
}
}else{
map1.put("z",skt);
map1.put("x",skt2);
map1.put("y",skt3);
map1.put("zxy",edg);
map1.put("man","男");
map1.put("man1","女");
map1.put("man2","合计");
if (yczb.equals("1")){
map1.put("tt","综合异常报表");
}else if (yczb.equals("2")){
map1.put("tt","血糖异常报表");
}else{
map1.put("tt","总胆固醇异常报表");
}
}
return map1;
}
service包
public List<Bt> findAllRe(Map map);
serviceImpl包
@Autowired
private ReportMapper reportDao;
@Override
public List<Bt> findAllRe(Map map) {
return reportDao.findAllRe(map);
}
Dao包
package com.ssm.mapper;
import com.ssm.model.Bt;
import com.ssm.model.Report;
import org.springframework.stereotype.Service;
import java.util.List;
import java.util.Map;
@Service
public interface ReportMapper {
/**
*
* @param map 条件查询的条件
* @return
*/
public List<Bt> findAllRe(Map map);
}