全国疫情可视化地图（第一阶段）
第一阶段运行结果：
查找界面：
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html"charset = "UTF-8"> <title>查找界面</title> </head> <body> <div align="center"> <h1 style="color: black;">信息查询</h1> <form action="${pageContext.request.contextPath}/CourseServlet?method=find" method="post" onsubmit="return check()"> <div > 开始时间<input class="Wdate" name="start" type="text" onfocus="WdatePicker()" > </div> <div > 结束时间<input class="Wdate" name="end" type="text" onfocus="WdatePicker()" > </div> <div > 省份<input type="text" name="province" > </div> <div > <button type="submit" class="b">查 询</button> </div> </form> </div> <script type="text/javascript"> function check() { //非空 } </script> </body> </html>
结果界面：
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8" > <title>查询结果</title> </head> <!-- ECharts单文件引入 --> <script type="text/javascript" defer="defer" src="<%=request.getContextPath() %>/My97DatePicker/WdatePicker.js"></script> <script src="echarts.min.js" ></script> </head> <body> <table> <tr> <td> <!-- 为ECharts准备一个具备大小（宽高）的Dom --> <div id="main" style="width: 500px;height:400px;"></div> <script type="text/javascript"> // 基于准备好的dom，初始化echarts实例 var city1=[]; <c:forEach items="${list}" var="a"> city1.push("${a.city}"); </c:forEach> //这里开一个数组村数据库查到的city var num1=[]; <c:forEach items="${list}" var="b"> num1.push("${b.confirmed}"); </c:forEach> var myChart = echarts.init(document.getElementById('main')); // 指定图表的配置项和数据 option = { title : { text: '疫情确诊数据', subtext: '城市和人数' }, tooltip : { trigger: 'axis' }, legend: { data:['城市','人数'] }, toolbox: { show : true, feature : { dataView : {show: true, readOnly: false}, magicType : {show: true, type: ['line', 'bar']}, restore : {show: true}, saveAsImage : {show: true} } }, calculable : true, xAxis : [ { type : 'category', data : city1, axisLabel:{ interval:0, rotate:30, } } ], yAxis : [ { type : 'value' } ], series : [ { name:'患者数', type:'bar', data:num1}] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option);//这里就用option更新 </script> </td> </tr> </table> <div align="center"> <table class="tb"> <tr> <td style="width: 200px;">时间</td> <td style="width: 200px;">省</td> <td style="width: 200px;">城市</td> <td style="width: 200px;">确诊人数</td> </tr> <!-- forEach遍历出adminBeans --> <c:forEach items="${list}" var="item" varStatus="status"> <tr> <td style="width: 200px;">${item.start}</td> <td style="width: 200px;">${item.province}</td> <td style="width: 200px;">${item.city}</td> <td style="width: 200px;">${item.confirmed}</td> </tr> </c:forEach> </table> </div> </body> </html>
com.bean
package com.fin.bean; public class yq { private String start; private String end; private String province; private String confirmed; private String city; public String getStart() { return start; } public void setStart(String start) { this.start = start; } public String getEnd() { return end; } public void setEnd(String end) { this.end = end; } public String getProvince() { return province; } public void setProvince(String province) { this.province = province; } public String getConfirmed() { return confirmed; } public void setConfirmed(String confirmed) { this.confirmed = confirmed; } public String getCity() { return city; } public void setCity(String city) { this.city = city; } public yq( String start,String end, String province,String city,String confirmed) { // TODO 自动生成的构造函数存根 this.start = start; this.end = end; this.province = province; this.city = city; this.confirmed = confirmed; } }
com.dao
package com.fin.dao; import java.sql.Connection; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; import java.util.ArrayList; import java.util.List; import com.fin.bean.yq; import com.fin.util.BaseConnection; public class CourseDao { public static List<yq> find(String start ,String end ,String province) { List<yq> list = new ArrayList<yq>(); String sql = "select * from city_map where provinceShortName ='"+province+"'"; Connection conn = BaseConnection.getConnection(); Statement state = null; ResultSet rs = null; try { state = conn.createStatement(); rs = state.executeQuery(sql); yq cour = null; while (rs.next()) { String startt =null; String endd = null; String shengg = rs.getString("provinceShortName"); String city = rs.getString("cityName"); String number = rs.getString("confirmedCount"); cour = new yq( startt,endd,shengg,city,number); list.add(cour); } } catch (SQLException e) { // TODO 自动生成的 catch 块 e.printStackTrace(); }finally { BaseConnection.close(rs, state, conn); } return list; } }
Servlet:
package com.fin.servlet; import java.io.IOException; import java.io.UnsupportedEncodingException; import java.util.ArrayList; import java.util.List; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; //import javax.smartcardio.ResponseAPDU; import com.fin.bean.yq; import com.fin.dao.CourseDao; /** * Servlet implementation class CourseServlet */ @WebServlet("/CourseServlet") public class CourseServlet extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#HttpServlet() */ public CourseServlet() { super(); // TODO Auto-generated constructor stub } /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub //response.getWriter().append("Served at: ").append(request.getContextPath()); response.setContentType("text/html;charset=UTF-8"); request.setCharacterEncoding("UTF-8"); String method = request.getParameter("method"); if(method.equals("find")) { find(request,response); } } private void find(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO 自动生成的方法存根 //Course cour = new Course(); response.setContentType("text/html;charset=UTF-8"); request.setCharacterEncoding("UTF-8"); /*response.setCharacterEncoding("UTF-8"); response.setHeader("content-type","text/html;charset=UTF-8");*/ String start = request.getParameter("start"); String end = request.getParameter("end"); String province = request.getParameter("province"); List<yq> list = CourseDao.find(start,end,province); request.setAttribute("list", list); //response.setHeader("refresh", "0;url=findResult.jsp"); request.getRequestDispatcher("findResult.jsp").forward(request,response); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub doGet(request, response); } }
