Commit d6a5602b by wangling

20190514---wangling---高危地区人员统计结果添加table展示,修改样式

parent 5811ef42
......@@ -44,10 +44,12 @@ public class GwdqfxtjController {
post.setEntity(reqEntity);
JSONObject jsonObject = null;
String content = gwdqService.RequestUtil(httpclient, post).trim();
System.out.println(content);
if (!"".equals(content)) {
jsonObject = JSONObject.parseObject(content);
//content = "{\"counts0\":\"[2, 5, 8, 12, 10]\",\"counts1\":\"[5, 7, 20, 6, 20]\",\"counts2\":\"[8, 10, 12, 5, 18]\",\"counts3\":\"[6, 11, 29, 6, 13]\"}";
System.out.println("content=="+content);
if ("{}".equals(content)) {
content = "{\"counts0\":\"[0, 0, 0, 0, 0]\",\"counts1\":\"[0, 0, 0, 0, 0]\",\"counts2\":\"[0, 0, 0, 0, 0]\",\"counts3\":\"[0, 0, 0, 0, 0]\"}";
}
jsonObject = JSONObject.parseObject(content);
ModelAndView modelAndView = new ModelAndView();
modelAndView.setViewName("gwdq/gwdqjg");
modelAndView.addObject("mapdata",jsonObject);
......
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.atg.com/taglibs/json" prefix="json" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>高危地区人员结果展示</title>
<!-- 引入 ECharts 文件 -->
<script src="/js/jquery-1.11.3.js"></script>
<script src="/js/echarts.min.js"></script>
<style>
html,body{height:100%;background: url(/images/zb-bg.jpg) no-repeat;background-size:cover;}
.table-wrap,#main{background: #fff;border-radius: 5px;box-shadow: 1px -1px 19px #1b1a1a;width:90%;margin:0 auto;padding:20px;margin-bottom:19px;}
.table-wrap table{float:left;width:48%;margin:0;}
.top{height:46px;line-height: 46px;text-align: center;}
caption {
font-size: 14px;
font-weight: bold;
line-height: 50px;
}
table {
border-collapse: collapse;
border: 1px #525152 solid;
width: 50%;
margin: 0 auto;
}
th, td {
border: 1px #525152 solid;
text-align: center;
font-size: 12px;
line-height: 30px;
}
th {
background: #D6D3D6;
}
tr td:first-child {
background: #BDBABD;
}
/*模拟对角线*/
.out {
border-top: 40px #D6D3D6 solid; /*上边框宽度等于表格第一行行高*/
width: 0px; /*让容器宽度为0*/
height: 0px; /*让容器高度为0*/
border-left: 80px #BDBABD solid; /*左边框宽度等于表格第一行第一格宽度*/
position: relative; /*让里面的两个子容器绝对定位*/
}
b {
font-style: normal;
display: block;
position: absolute;
top: -40px;
left: -40px;
width: 35px;
}
em {
font-style: normal;
display: block;
position: absolute;
top: -25px;
left: -70px;
width: 55px;
}
</style>
</head>
<body>
<div id="main" style="width: 1500px;height:500px;position: absolute; top:50%; left: 30%; margin-top: -200px; text-align: center; margin-left: -350px"></div>
<div class="top"><img src="/images/jh.png" style="width: 62px;"/><img src="/images/ajzb-logo-t.png" style="height:48px;position: relative;top: -5px;"/></div>
<div class="table-wrap" style="overflow: hidden; margin-top: 27px;">
<table style="margin-right: 4%;">
<caption>案发前后2天住宿人员</caption>
<tr>
<th style="width:80px;">
<div class="out">
<b>时间</b>
<em>地点</em>
</div>
</th>
<th>前2天</th>
<th>前1天</th>
<th>案发日</th>
<th>后1天</th>
<th>后2天</th>
</tr>
<tr>
<td>辖区</td>
<c:forEach var="zs" items="${fn:substring(mapdata.counts0, 1, mapdata.counts0.length()-1)}">
<td>${zs}</td>
</c:forEach>
</tr>
<tr>
<td>全市</td>
<c:forEach var="zs2" items="${fn:substring(mapdata.counts1, 1, mapdata.counts1.length()-1)}">
<td>${zs2}</td>
</c:forEach>
</tr>
</table>
<table>
<caption>案发前后2天上网人员</caption>
<tr>
<th style="width:80px;">
<div class="out">
<b>时间</b>
<em>地点</em>
</div>
</th>
<th>前2天</th>
<th>前1天</th>
<th>案发日</th>
<th>后1天</th>
<th>后2天</th>
</tr>
<tr>
<td>辖区</td>
<c:forEach var="sw" items="${fn:substring(mapdata.counts2, 1, mapdata.counts2.length()-1)}">
<td>${sw}</td>
</c:forEach>
</tr>
<tr>
<td>全市</td>
<c:forEach var="sw2" items="${fn:substring(mapdata.counts3, 1, mapdata.counts3.length()-1)}">
<td>${sw2}</td>
</c:forEach>
</tr>
</table>
</div>
<div id="main" style="height:500px; text-align: center;"></div>
<script type="text/javascript">
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
option = {
title : {
text: '高危地区结果统计展示',
text: '高危地区人员结果统计展示',
subtext: '高危地区人员结果'
},
tooltip : {
......@@ -117,6 +231,7 @@
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
setInterval('$("#main").css("background","#fff")',1);
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment