zoukankan html css js c++ java

疫情查询可视化

一、效果展示

输入日期

点击查询

二、原码

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>疫情查询</title>
</head>
<frameset rows="20%,10%,*">
        <frame src="top.html" >
        <frame src="query.jsp" >
        <frame name="show">
    </frameset>
</html>

frame.jsp

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div align="center">
    <font size="7" >欢迎查询疫情状况</font>
   </div>
</body>
</html>

top.html

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
 <!--         这个用来选择日期 -->
    <div align="center">
    <form action="QueryServlet" target="show" method="post">
          日期<input type="datetime" name="Date">
          <input type="submit" value="查询">
    </form>
    </div>
</body>
</html>

query.jsp

<%@page import="entity.Info"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="Echart/echarts.min.js"></script>
</head>
<body>
<%         request.setCharacterEncoding("utf-8");
List <Info> infos =(List<Info>) request.getAttribute("infos"); 

int i=0;%>
<div id="main" align="center" style=" 600px;height:400px;" ></div>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('main'));
 
        var option = {
                dataset: {
                    source: [
                        [  '省份','确诊人数'],
                        <%
                        //获取request域中的数据
                        if(infos!=null){
                        for(Info info:infos){i++;
                    %>
                            [<%=Integer.parseInt(info.getConfirmed_num())%>,'<%=info.getProvince()%>'],
                    <%
                        if(i>33)break;
                        }
                    
                        }
                    %>
                    ]
                },
                grid: {containLabel: true},
                xAxis: {},
                yAxis: {type: 'category'},
                series: [
                    {
                        type: 'bar',
                        encode: {
                            // 将 "amount" 列映射到 X 轴。
                            x: '省份',
                            // 将 "product" 列映射到 Y 轴。
                            y: '确诊人数'
                        }
                    }]
        };
 
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
    <table border="1px" align="center">
         <tr>
         <th>省份</th>
         <th>城市</th>
         <th>确诊人数</th>
         <th>疑似人数</th>
         <th>死亡人数</th>
         </tr>
         <%

         if(infos!=null){
           for(Info info:infos){
               %>
               
               <tr>                   
                   <td><%=info.getProvince() %></td>
                   <td><%=info.getCity() %></td>
                   <td><%=info.getConfirmed_num() %></td>
                   <td><%=info.getYisi_num() %></td>
                   <td><%=info.getDead_num() %></td>
               </tr>
               <%
           }
         }
         %>
      </table>
</body>
</html>

show.jsp

package servlet;

import java.io.IOException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import dao.dao;
import entity.Info;




public class QueryServlet extends HttpServlet {

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        /**
         * 这里是设置编码集，以避免出现乱码问题
         */
        request.setCharacterEncoding("utf-8");
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        /**
         * 下面是获取从query.jsp页面传回的值
         */
        String Date=request.getParameter("Date");
        System.out.println(Date);
        /**
         * 实现服务的实例化
         */
        dao dao=new dao();
        List<Info> infos=dao.Query(Date);
        System.out.println(infos);
        request.setAttribute("infos",infos);
        request.getRequestDispatcher("show.jsp").forward(request, response);
    }


    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doGet(request, response);
    }

}

QueryServlet

package dao;

import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

import entity.Info;
import utils.DBUtil;

public class dao {
       public List<Info> Query(String Date) {
           List<Info> infos=new ArrayList<>();
           Info info= null;
             ResultSet rs = null; 
           try {
               String sql="select * from info where Date=? " ;
               Object [] params= {Date};
               rs=DBUtil.executeQuery(sql, params);
               while(rs.next()) {
                   int Id=rs.getInt("Id");
                   String Province=rs.getString("Province");
                   String City=rs.getString("City");
                   String Confirmed_num=rs.getString("Confirmed_num");
                   String Yisi_num=rs.getString("Yisi_num");
                   String Cured_num=rs.getString("Cured_num");
                   String Dead_num=rs.getString("Dead_num");
                   String Code=rs.getString("Code");
                   info=new Info(Id,Date,Province,City,Confirmed_num,Yisi_num,Cured_num,Dead_num,Code);
                   infos.add(info);
               }
           }catch(SQLException e) {
               e.printStackTrace();
           }catch(Exception e) {
               e.printStackTrace();
           }finally {
               try {
                   //先开的后关，后开的先关
               if(rs!=null)rs.close();
               if(DBUtil.pstmt!=null)DBUtil.pstmt.close();
               if(DBUtil.connection !=null)DBUtil.connection.close();
               }catch(SQLException e) {
                   e.printStackTrace();
               }finally {
                   
               }
              
           }
           return infos;
       }
}

dao.java

package entity;

public class Info {
     private int Id;
     private String Date;
     private String Province;
     private String City;
     private String Confirmed_num;
     private String Yisi_num;
     private String Cured_num;
     private String Dead_num;
     private String Code;
    public int getId() {
        return Id;
    }
    public void setId(int id) {
        Id = id;
    }
    public String getDate() {
        return Date;
    }
    public void setDate(String date) {
        Date = date;
    }
    public String getProvince() {
        return Province;
    }
    public void setProvince(String province) {
        Province = province;
    }
    public String getCity() {
        return City;
    }
    public void setCity(String city) {
        City = city;
    }
    public String getConfirmed_num() {
        return Confirmed_num;
    }
    public void setConfirmed_num(String confirmed_num) {
        Confirmed_num = confirmed_num;
    }
    public String getYisi_num() {
        return Yisi_num;
    }
    public void setYisi_num(String yisi_num) {
        Yisi_num = yisi_num;
    }
    public String getCured_num() {
        return Cured_num;
    }
    public void setCured_num(String cured_num) {
        Cured_num = cured_num;
    }
    public String getDead_num() {
        return Dead_num;
    }
    public void setDead_num(String dead_num) {
        Dead_num = dead_num;
    }
    public String getCode() {
        return Code;
    }
    public void setCode(String code) {
        Code = code;
    }
    @Override
    public String toString() {
        return "Info [Id=" + Id + ", Date=" + Date + ", Province=" + Province + ", City=" + City + ", Confirmed_num="
                + Confirmed_num + ", Yisi_num=" + Yisi_num + ", Cured_num=" + Cured_num + ", Dead_num=" + Dead_num
                + ", Code=" + Code + "]";
    }
    public Info(int id, String date, String province, String city, String confirmed_num, String yisi_num,
            String cured_num, String dead_num, String code) {
        Id = id;
        Date = date;
        Province = province;
        City = city;
        Confirmed_num = confirmed_num;
        Yisi_num = yisi_num;
        Cured_num = cured_num;
        Dead_num = dead_num;
        Code = code;
    }
    public Info(String date, String province, String city, String confirmed_num, String yisi_num, String cured_num,
            String dead_num) {
        Date = date;
        Province = province;
        City = city;
        Confirmed_num = confirmed_num;
        Yisi_num = yisi_num;
        Cured_num = cured_num;
        Dead_num = dead_num;
    }
    public Info() {
    }
     
}

Info.java

package utils;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;


public class DBUtil {
    //数据库URL和账号密码
            private static final String URL="jdbc:mysql://localhost:3306/test?serverTimezone=UTC&characterEncoding=utf-8";
            private static final String UNAME="root";
            private static final String UPWD="vayne";
            public static PreparedStatement  pstmt=null;
            public static ResultSet  rs = null;
            public static Connection  connection=null;
            
            
     //增删改
     public static boolean executeUpdate(String sql,Object [] params) {
         boolean flag = false;
         try {
             
         //a.导入驱动，加载具体的驱动类
         Class.forName("com.mysql.cj.jdbc.Driver");
         //b.与数据库建立连接
         connection = DriverManager.getConnection(URL,UNAME,UPWD);
         
         pstmt = connection.prepareStatement(sql);
         for(int i=0;i<params.length;i++) {
             pstmt.setObject(i+1, params[i]);
         }
         int count=pstmt.executeUpdate();//返回值表示，增删改几条数据
         //处理结果
         if(count>0)
         {
             System.out.println("操作成功！！！");
             flag=true;
         }
         
         }catch(ClassNotFoundException e) {
             e.printStackTrace();
         }catch(SQLException e) {
             e.printStackTrace();
         }catch(Exception e){
             e.printStackTrace();
         }finally {
             try {
                 //先开的后关，后开的先关
             if(pstmt!=null)pstmt.close();
             if(connection !=null)connection.close();
             }catch(SQLException e) {
                 e.printStackTrace();
             }finally {
                 
             }
         }
        return flag;
     }
    //查
     public static ResultSet executeQuery(String sql,Object [] params) {
         
                 try {
                     
                 //a.导入驱动，加载具体的驱动类
                 Class.forName("com.mysql.cj.jdbc.Driver");
                 //b.与数据库建立连接
                 connection = DriverManager.getConnection(URL,UNAME,UPWD);
                 
                 pstmt = connection.prepareStatement(sql);
                 if(params!=null) {
                 for(int i=0;i<params.length;i++) {
                     pstmt.setObject(i+1, params[i]);
                 }
                 }
                  rs = pstmt.executeQuery();
                  return rs;
                 }catch(ClassNotFoundException e) {
                     e.printStackTrace();
                     return null;
                 }catch(SQLException e) {
                     e.printStackTrace();
                     return null;
                 }catch(Exception e){
                     e.printStackTrace();
                     return null;
                 }
             
        }
}

DBUtil.java

查看全文

相关阅读:
Phabricator实践（2）：配置——通知服务（Notifications ）
Phabricator实践（3）：代码审核——提交前Review vs 提交后Audit（Review vs Audit）
node.js安装（CentOS）
Phabricator实践（2）：配置——配置Repository
Phabricator实践（3）：代码审核——提交后Audit
Phabricator实践（4）：其他功能——Phriction（WIKi）
Phabricator实践（2）：组织结构——账户角色（Account Role）
Python27的安装
 Phabricator实践（4）：其他功能——Phame （BLOG）
Phabricator实践（3）：代码审核——为代码库设定Packege及其Owner

原文地址：https://www.cnblogs.com/yeyueweiliang/p/12404194.html